Question

我知道angular.js和ui-router。所以我试图理解： 1.如何在一个状态下执行两个不同的操作，具体取决于用户登录或不登录。 2.在几个状态中重定向到主页面用户未登录

以下是示例：有一个服务＆＃34; Atuhentication＆＃34;认为是认证用户。但我无法将其加载到module.config（），因此会出现错误。

$stateProvider
    .state('home', {
        // if user is logged in go to state "chat"
        // else go to state "welcome"
    })
    .state('chat', function(){
        // if user is not logged in redirect to home page
    })

我试图在状态控制器中制作它，但它是脏的方式，因为它加载模板＆amp;控制器，然后检查用户是否登录，如果没有，则重定向。

亲爱的朋友们，请说明正确的行动方向

Answer 1

你总能挂钩＆amp;使用状态更改时正在广播的$stateChangeStart事件来阻止状态更改。您可以在应用程序中可用的任何顶级控制器中添加此事件侦听器（如添加到body标记的控制器），或者您可以使用$rootScope之类的任何服务添加此事件侦听器代码下面：

var protectedStates = ['home', 'chat'];

$rootScope.$on('$stateChangeStart', function(event, toState, toParams) {
     // See if state being transitioned needs to be access checked
     if (protectedStates.indexOf(toState.name) > -1) {
         if (!userLoggedIn) {
              // Prevent the current state from being changed
              event.preventDefault();
              $state.go('home');       // go to home page or login page.
         }
     }
});

更多参考：http://angular-ui.github.io/ui-router/site/#/api/ui.router.state。$ state

希望这有帮助！

谢谢，
SA

检查用户是否在模板加载前登录，根据用户登录执行2个不同的操作

1 个答案: