angularjs – 第一次打开应用程序时的条件页面显示

发布时间：2020-12-17 17:55:47 所属栏目：安全来源：网络整理

导读：嗨,我刚开始学习角度 angular-ui-router我正在试图弄清楚如何确定应用程序何时首次打开以将用户发送到登录页面或主页. 这是我到目前为止： codeArtApp.config(function($stateProvider,$urlRouterProvider){$stateProvider .state('login',{ url : '/login',

嗨,我刚开始学习角度&& angular-ui-router我正在试图弄清楚如何确定应用程序何时首次打开以将用户发送到登录页面或主页.

这是我到目前为止：

codeArtApp.config(function($stateProvider,$urlRouterProvider){
$stateProvider
    .state('login',{
        url : '/login',templateUrl:'App/scripts/login/loginView.html',controller: 'loginCtrl'
    })
    .state('profile',{
        url : '/profile',controller: 'profileCtrl'
    })
    .state('404',{
        url: '/404',templateUrl:'App/scripts/views/404.html'
    });


$urlRouterProvider.otherwise("404");

});

codeArtApp.run(['$state','$rootScope',function($state,$rootScope,$log){
$rootScope.$on('$stateChangeStart',function(event,toState,toParams,fromState){
    if(fromState.url === '^' && toState.url !== 'login'){
        $state.go('login');
    }

});

}]);

我在这里假设的是,如果fromState.url设置为^,那么应用程序将首次启动.

出于某种原因,这段代码进入了一个无限循环,我将这个栈跟踪：

现在从我可以告诉我发生这种情况是因为如果$state.go(‘login’)获得执行toState.url的事件总是404.

我曾希望如果$state.go(‘login’)被执行到state.url将被设置为登录并且该调用将不再执行.

我可能没有把这个逻辑设置在正确的位置……

任何人都可以告诉我在Angular中如何实现条件页面显示？

解决方法

有一个工作 plunker的链接,主要更改显示在代码中：

codeArtApp.run(['$state',$log) {

  $rootScope.$on('$stateChangeStart',fromState) {

      // instead of 
      // toState.url !== 'login'
      // we compare 
      // toState.name !== 'login'
      var shouldLogin = fromState.url === '^' 
              && toState.name !== 'login';

      if(shouldLogin)
      {
        // this way we stop current execution
        event.preventDefault();
        // and navigate to login
        $state.go('login');  
      }
    });
 }
]);

toState.url将包含url,即’/ login’而不是’login’.另请查看：State Change Events以查看有关event.preventDefault()的更多信息; . plunker显示以上……

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!