为什么我的Angular状态没有被加载？

Question

At the start of my app, I have :

$urlRouterProvider.otherwise('/loading');

which brings control to my loadCtrl . Here I have:

Service.getRoleDetails(config.USER_DETAILS_URL).then(useRoleDetails, handleApiError);

        function useRoleDetails(response) {
            if (response.id === 1) {
                $state.go('home');
            }
            else
                $state.go('master');
        }

        function handleApiError(error) {
            Overlay.applyOverlay(false);
        }

This servcie call and callback function works fine. The if - conditions gets fulfilled but somehow the state do not change to home . My screen is stuck at the initial page only. (which is the template for `/loading'.)

I have never faced such issue with $state , Am I doing something wrong?? Though I have no console errors

Any suggestion??

My config:

$stateProvider.state('preload', {
            url: '/loading',
            views: {
                "main": {
                    controller: 'landingPageCtrl as lc',
                    templateUrl: 'PP/htmls/landing.tpl.html'
                }
            },
            data: {
                pageTitle: 'PricingPlan'
            }
        })
        .state('home', {
            url: '/pricingplan',
            views: {
                "main": {
                    controller: 'PPCtrl as pp',
                    templateUrl: 'PP/htmls/pricing-position.tpl.html'
                }
            },
            data: {
                pageTitle: 'Pricing Plan'
            }
        })
        .state('master', {
            url: '/master',
            views: {
                "main": {
                    controller: 'masterDataCtrl as mdc',
                    templateUrl: 'PP/htmls/MasterData/masterData.tpl.html'
                }
            },
            data: {
                pageTitle: 'Master Data'
            }
        })
        .state('logout',{
            url: '/loggedOut',
            views: {
                "main": {
                    controller: 'logOutCtrl as lc',
                    templateUrl: 'PP/htmls/logout.tpl.html'
                }
            },
            data: {
                pageTitle: 'Session Expired'
            }
        });


    }

Answer 1

I dug deeper and found that everything was OK with Angular and my above implementation (in Question). However, I had an existing logic in my $stateChangeStart event listener. The state change was getting restricted there.

Anyone facing any issue of such kind should have one look in $stateChangeStart listener.