AngularJS - controller data outside ng-view

Question

I want to have access to the scope isAuthenticated outside the ng-view. I have tried to add ng-controller to the body, the problem is I can't have access to the isAuthenticated because it's inside the resolve block.

This is what i have:

.state('index', {
            url: '/',
            resolve: {
                isAuthenticated: function($auth) {
                    return $auth.validateUser().then(function(res) {
                        return true;
                    }, function(error) {
                        return false;
                    });
                }
            },
            controller: function($scope, isAuthenticated) {
                $scope.isAuthenticated = isAuthenticated;
            },
            templateUrl: 'index.html'
        })

I have two navbar states, one navbar at the home page and another one when the user is logged in.

<body>
    <div ng-if="isAuthenticated">
      <div ng-include="'user_navbar.html'"></div>
    </div>

    <div ng-if="!isAuthenticated">
      <div ng-include="'home_navbar.html'"></div>
    </div>
    <div ui-view></div>
</body>

I don't want to put the navbar in all my views, I don't want to duplicate code.

you should store isAuthenticated in global scope, for example in $rootScope — Narek Mamikonyan, Oct 27 '14 at 13:42
Store isAuthenticated in a service. Avoid using $rootScope as much as possible. — Abhishek Jain, Oct 27 '14 at 13:48
if it general on all your application you can use $rootScope, I would suggest dont register events on $rootScope — Narek Mamikonyan, Oct 27 '14 at 13:52
Wrap a different scope (controller) around your ng-view. Store the variable as an object property in the parent scope and let the child scope inherit it. — Blazemonger, Oct 27 '14 at 13:59

AngularJS - controller data outside ng-view

0 Answers0