javascript - ui-router $ transitions挂钩在浏览器重新加载时未调用

我正在使用ui-router 1.0.3在Angular 1.5.8中制作一个应用程序。
Ui路由器的钩子很棒，但是不能在浏览器重新加载时使用。

这是我用于注册状态的配置块：

(function(app) {
    'use strict';
    app.config(configFn);

    configFn.$inject = ['$stateProvider'];

    function configFn($stateProvider) {
        $stateProvider
            .state('login', {
                url: '/login',
                component: 'loginComponent'
            })
            .state('selfcare', {
                url: '/',
                component: 'selfCareComponent',
                abstract: true
            })
            .state('selfcare.dashboard', {
                url: 'dashboard',
                component: 'dashboardComponent'
            })
            .state('selfcare.appHome', {
                url: 'appHome/:id',
                component: 'appHomeComponent'
            })
            .state('selfcare.serviceHome', {
                url: 'serviceHome/:id',
                component: 'serviceHomeComponent'
            })
    }

})(angular.module('selfcare'));

以下是在过渡上注册钩子的运行块：

(function(app) {
    'use strict';
    app.run(runFn);

    runFn.$inject = ['$rootScope', '$transitions' ,'$localStorage'];

    function runFn($rootScope, $transitions,  $localStorage) {

        $transitions.onStart({to:'**'}, function(transtion){
            $rootScope.ngProgress.start();
        })

        $transitions.onSuccess({to:'**'}, function(transtion){
            $rootScope.ngProgress.complete();
        })

       $transitions.onBefore({to:'login'}, function(transtion){
            if($localStorage.isLoggedIn > Date.now()){
                return transtion.router.stateService.target('selfcare.dashboard');
            }
        })

       $transitions.onBefore({to:'selfcare.**'}, function(transtion){
            if(!$localStorage.isLoggedIn || $localStorage.isLoggedIn < Date.now()){
                $localStorage.$reset();
                return transtion.router.stateService.target('login');
            }
        })
    }

})(angular.module('selfcare'));

我无法弄清楚我在哪里做错了。应用程序稳定且可以正常运行后，将调用挂钩，但是在重新加载浏览器时，我可以打开任何url，并且没有调用任何挂钩。

任何帮助将不胜感激。谢谢

最佳答案

我以某种方式设法完成了所需的操作，但我不知道这是否是最好的方法。我想在运行块中编写过渡。

挂钩回调的参数Transition对象提供一个injector，可用于在应用程序的config块中获取运行时服务。

（我们也可以在$injector块中注入config）

(function(app) {
    'use strict';
    app.config(configFn);

    configFn.$inject = ['$transitionsProvider'];

    function configFn($transitionsProvider) {

        $transitionsProvider.onStart({ to: '**' }, function(transtion) {
            transtion.injector().get('$rootScope').ngProgress.start();
        })

        $transitionsProvider.onSuccess({ to: '**' }, function(transtion) {
            transtion.injector().get('$rootScope').ngProgress.complete();
        })

        $transitionsProvider.onBefore({ to: 'login' }, function(transtion) {
            var $localStorage = transtion.injector().get('$localStorage');
            if ($localStorage.isLoggedIn > Date.now()) {
                return transtion.router.stateService.target('selfcare.dashboard');
            }
        })

        $transitionsProvider.onBefore({ to: 'selfcare.**' }, function(transtion) {
            var $localStorage = transtion.injector().get('$localStorage');
            if (!$localStorage.isLoggedIn || $localStorage.isLoggedIn < Date.now()) {
                $localStorage.$reset();
                return transtion.router.stateService.target('login');
            }
        })
    }

})(angular.module('selfcare'));