AngularJS: Go to a state only if that state has not transitioned to before

Question

I have the following state in routes.js :

.state('showorderflow', {
    url: "#",
    templateUrl: '/assets/views/tvx/selection.html',
    controller: 'tvxChannelSelectCtrl'
})

and in my html I have the following code:

<a class="click-to-select" href="#"
    ng-click="packBtnClick($event)"> Click to order </a>

and my controller looks like this:

$scope.packBtnClick = function ($e) {
    $state.go('showorderflow');
    // do something else. 
}

I want to go to the state showorderflow only if it hasn't been transitioned to before. How can I do that?

Set a flag on the rootScope or on a service as soon as tvxChannelSelectCtrl loads. Then check that flag before you call $state.go('showorderflow'); — matmo
– matmo, Commented Jul 23, 2016 at 0:42

Shashank Agrawal · Accepted Answer · 2016-07-23 04:09:52Z

You can add a controller say GlobalController in your body or html tag so that its scope is available throughout your pages (trying to prevent use of $rootScope). Now, in the GlobalController you can add a listener for state change:

$scope.$on('$stateChangeStart', function(e, toState) {
    if (toState.name === 'showorderflow') {
        // Use a key "hasBeenTransitionedBeforeFoo" to check if the user is already transitioned to that state before
        if (toState.hasBeenTransitionedBeforeFoo) {
            // If yes, then prevent the navigation
            e.preventDefault();
            return;
        }

        // Otherwise mark it as true on first time transition
        toState.hasBeenTransitionedBeforeFoo = true;
    }
});

Alternatively, you can register the same callback in the run block of your app

myApp.run(['$rootScope', function($rootScope) {
    $rootScope.$on('$stateChangeStart', function(e, toState) {
        // same code goes here
    });
}]);

Collectives™ on Stack Overflow

AngularJS: Go to a state only if that state has not transitioned to before

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related