Getting a "Transition Rejection( .." error after using "$state.go('stateName', null, {'reload':true});"

user_4428031 0
Viewed 11469

I was trying to reload my controller using

$state.go('movies', null, {'reload':true});

But after using this, I am getting this error

Transition Rejection($id: 1 type: 2, message: The transition has been superseded by a different transition, detail: Transition#63( 'home'{} -> 'movies'{} ))

I am clueless why is this happening. Although the functionality is working fine.

Code:

$scope.filterMovies = function(genre){
    var filteredMovies = [];
    MoviesService.msGetData().then(function(dataparam){
        $scope.movielist = dataparam;
        for(var idx=0; idx<$scope.movielist.length; idx++){
            if($scope.movielist[idx].genres.indexOf(genre) > -1){
                filteredMovies.push($scope.movielist[idx]);
                MoviesService.msSetFilteredMovies(filteredMovies);
                //$state.go('movies');
                $state.go('movies', null, {'reload':true});
            }
        }
     });
 }

Note: I am using AngularJS v1.6.5 and angular-ui-router v1.0.5

angular-ui-router angularjs
3 Answers

The error is occurring because you're creating a new transition within an existing one. As the error says, the transition to home is being superseded by the transition to movies which you're creating with $state.go('movies'[, ...]);.

To stop the error occurring place $state.go('movies') within a $timeout. E.g. 

$timeout(function() {
  $state.go('movies', null, {'reload':true});
});
user_6044350

In my case, a routes file was angry about an empty permissions array:

import * as angular from 'angular';
import '@uirouter/angularjs';
import { StateProvider, UrlRouterProvider } from '@uirouter/angularjs';
import { Permissions } from '@appname/app.permissions';

angular.module('app').config([
    '$stateProvider',
    '$urlRouterProvider',
    'PERMISSIONS',
    function ($stateProvider: StateProvider, $urlRouterProvider: UrlRouterProvider, PERMISSIONS: Permissions) {
    $urlRouterProvider.when('/batch', '/batch/abc');

    $stateProvider
        .state('batch', {
            parent: 'root',
            url: '/batch',
            template: '<batch></batch>',
            data: {
                permissions: [PERMISSIONS.NavItemBatch],
                menu: {
                    name: 'navigation.batch',
                    icon: 'file_upload',
                    showSubmenu: true
                }
            }
        }).state('batch.abc', {
            url: '/abc',
            template: '<abc></abc>',
            data: {
                permissions: [],// <-- angry - remove entirely or add valid permission
                menu: {
                    name: 'ABC'
                }
            }
        });
}]);
user_20045320
Related