CODEWITHSUNDEEP
javascriptangularjs
Sagun Gautam
Sagun Gautam

Reputation: 470

$rootScope:infdig error in angularjs application

Once the user logged in to our application users credentials is stored into local storage. If the user routes to login state as he is already logged in, its shows following error in the console:

Uncaught Error: [$rootScope:infdig] http://errors.angularjs.org/1.3.10/$rootScope/infdig?p0=10&p1=%5B%5D

Code to check the local storage and redirect the user

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {

        // Grab the user from local storage and parse it to an object
        var user = JSON.parse(localStorage.getItem('user'));

        // If there is any user data in local storage then the user is quite
        // likely authenticated.

        if(!user) {
            if(toState.name !== 'login.signin'){
                //go to application "login" state
                $state.go('login.signin');
                event.preventDefault();
            }
        }
        else{
            // The user's authenticated state gets flipped to
            // true so we can now show parts of the UI that rely
            // on the user being logged in
            $rootScope.authenticated = true;

            // Putting the user's data on $rootScope allows
            // us to access it anywhere across the app.
            // Here we are grabbing what is in local storage
            $rootScope.currentUser = user;


            if(toState.name === "login.signin") {

                // go to the application "dashboard" state
                $state.go('app.dashboard');

                // Preventing the default behavior allows us to use $state.go
                // to change states
                event.preventDefault();
            }
        }
    });

My Solution was

Changing $stateChangeStart with $stateChangeSuccess

Upvotes: 0

Views: 148

Answers (1)

Sandeep
Sandeep

Reputation: 1479

when your digest circle running u can't change any scope variable I think u use $timeout. inject $timeout where u define it

$rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams) {
$timeout(function(){
var user = JSON.parse(localStorage.getItem('user'));

        // If there is any user data in local storage then the user is quite
        // likely authenticated.

        if(!user) {
            if(toState.name !== 'login.signin'){
                //go to application "login" state
                $state.go('login.signin');
                event.preventDefault();
            }
        }
        else{
            // The user's authenticated state gets flipped to
            // true so we can now show parts of the UI that rely
            // on the user being logged in
            $rootScope.authenticated = true;

            // Putting the user's data on $rootScope allows
            // us to access it anywhere across the app.
            // Here we are grabbing what is in local storage
            $rootScope.currentUser = user;


            if(toState.name === "login.signin") {

                // go to the application "dashboard" state
                $state.go('app.dashboard');

                // Preventing the default behavior allows us to use $state.go
                // to change states
                event.preventDefault();
            }
 }
});

Upvotes: 1

Related Questions