Angular ui.router reload parent templateProvider

Question

I have an abstract base template that loads the navigation based on the user type. This part works on initial loading. The problem is I can\'t get the parent templateProvi

Answer 1

I created working example here. It is coming from this Q & A

This would be the adjusted state def:

.state('base', { 
    abstract: true,
    views: {
        '': {
            template: '<ui-view></ui-view>',
        },
        /*
        nav: {
            templateProvider: function ($templateFactory, User, $stateParams){
                if(User.exists()){
                    var url = '/static/html/navs/' + User.get.type + '.html';
                    return $templateFactory.fromUrl(url);
                }
                else{
                    return false;
                }
            }
        },*/
        nav: {
          templateProvider: ['User', '$templateRequest', function(User, templateRequest){ 

            var tplName = 'templates/templateNotExists.html';

            if(User.exists) {

              tplName = 'templates/templateExists.html';
            }

            return templateRequest(tplName); 
          }],
        },
    }
})

As we can see, we use new feature called '$templateRequest', to get html template from server, based on the url.

and these are controllers and services

.controller('loginController', ['$scope', 'User', function ($scope, User) {
  $scope.User = User;
}])
.factory('User', function(){   return { exists: false, }; })

And this is the content of the template of the child 'base.index' state:

<input type="checkbox" ng-model="User.exists" />
<button ng-click="$state.go('base.index', null, {reload: true})" >reload</button>

Check that all in action here