条件页面首次打开应用程序时显示

时间:2014-06-22 09:37:05

标签: angularjs state angular-ui-router

嗨,我刚开始学习角度&& 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',
        templateUrl:'App/scripts/login/loginView.html',
        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设置为^,那么应用程序将首次启动。

由于某种原因,这段代码进入了一个无限循环,我将这个堆栈跟踪: enter image description here

现在我可以告诉您发生这种情况,因为$state.go('login')执行toState.url时的事件总是 404

我原本希望如果$state.go('login')被执行toState.url将被设置为登录并且该呼叫将不再执行。

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

有谁能告诉我在Angular中如何实现条件页面?

2 个答案:

答案 0 :(得分:7)

System.Threading.Thread.CurrentThread.CurrentCulture = new System.Globalization.CultureInfo("es-PE"); System.Threading.Thread.CurrentThread.CurrentUICulture = new System.Globalization.CultureInfo("es-ES"); 通话中,您可以传递函数而不是字符串。像这样:

$urlRouterProvider.otherwise

希望这有帮助!

答案 1 :(得分:3)

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

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

  $rootScope.$on('$stateChangeStart', 
    function(event, toState, toParams, 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将包含网址,即'/login'而不是'login'。另请查看:State Change Events以查看有关event.preventDefault();的更多信息。显示上述内容的plunker ......