Angularjs 如何使用Angular UI路由器重定向未经验证的电子邮件用户？

我将AngularJS与Meteor一起使用，希望将未经验证的电子邮件用户重定向到登录页面。我已在

/client/routes.js

中创建了登录视图：

app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise('/');

  $stateProvider

  .state('signin', {
    url:'/signin',
    views: {
      main: {
        templateUrl: 'client/views/profile/signin.tpl'
      }
    }
  })

请注意，为了简洁起见，我没有列出其他州

现在，如果用户的电子邮件未经验证，我想将用户重定向到此登录页面。如何从修改下面的示例以满足我的需要？我可以接受不使用以下示例的其他解决方案，只要它们解决了手头的问题

示例：使用状态配置上的数据对象定义规则 将针对用户运行逻辑的函数（此处使用示例 服务名为$currentUser）。$stateChangeStart处理程序捕获 所有状态转换，并在允许 转换，可能会阻止它和/或重定向到其他 国家

---

FAQ中的示例尝试创建一种将规则添加到任何页面的常规方法。让我们保持简单：

app.run(function($rootScope, $state, UserService) {
    $rootScope.$on('$stateChangeStart', function(event, toState) {
        // don't check auth on login routes
        if (["signin"].indexOf(toState.name) === -1) {
            if (UserService.doesNotHaveVerifiedEmail()) {
                event.preventDefault();
                $state.go('signin');
                return;
            }
        }
    }
}); 

---

只要加载了一个状态，而它不是登录状态，您就会检查用户是否经过验证（取决于您的应用程序，这里我正在注入一个UserService，我假设它知道用户的状态），如果没有，您可以阻止该状态更改并将其重定向到登录页面。

您可以使用angular ui router提供的

解析

功能在解析状态之前检查当前用户的电子邮件验证。下面是代码的外观：

app.config(['$stateProvider', '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {

        var isVerified = ['User', '$state', '$q',
            function(User, $state, $q) {
                var d = $q.defer();
                var loginPromise = User.getVerificationStatus();
                loginPromise.then(
                    function(response) {
                        d.resolve(response);
                    },
                    function(error) {
                        $state.go('login');
                    });
                return d.promise;
            }
        ];

        $urlRouterProvider.otherwise('/');

        $stateProvider

            .state('signin', {
                url: '/signin',
                views: {
                    main: {
                        templateUrl: 'client/views/profile/signin.tpl'
                    }
                }
            })
            .state('home', {
                url: '/home',
                views: {
                    main: {
                        templateUrl: 'client/views/profile/home.tpl'
                    }
                },
                resolve: {
                    verified: isVerified
                }
            });
    }
]);

此处

home

在解析前检查验证状态。我已经注入了一个服务

User

，它将安排用户是否被验证的信息

您只能将resolve属性添加到要检查验证状态的状态。这样做比检查

$stateChangeStart

事件要好，无论是否需要此检查，每次状态更改时都会触发该事件

---

这是到的链接。

感谢您的全面回复。我不想按照你的建议这样做，因为我必须将

解析

代码放入每个状态。我更喜欢像@vvondrat的答案那样的全局检查。这个答案更强大、更可靠。谢谢你在文档中的链接！

app.config(['$stateProvider', '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {

        var isVerified = ['User', '$state', '$q',
            function(User, $state, $q) {
                var d = $q.defer();
                var loginPromise = User.getVerificationStatus();
                loginPromise.then(
                    function(response) {
                        d.resolve(response);
                    },
                    function(error) {
                        $state.go('login');
                    });
                return d.promise;
            }
        ];

        $urlRouterProvider.otherwise('/');

        $stateProvider

            .state('signin', {
                url: '/signin',
                views: {
                    main: {
                        templateUrl: 'client/views/profile/signin.tpl'
                    }
                }
            })
            .state('home', {
                url: '/home',
                views: {
                    main: {
                        templateUrl: 'client/views/profile/home.tpl'
                    }
                },
                resolve: {
                    verified: isVerified
                }
            });
    }
]);