根据条件重定向到某条路线

一尘不染

根据条件重定向到某条路线

angularjs

我正在编写一个小的AngularJS应用，该应用具有登录视图和主视图，其配置如下：

$routeProvider
 .when('/main' , {templateUrl: 'partials/main.html',  controller: MainController})
 .when('/login', {templateUrl: 'partials/login.html', controller: LoginController})
 .otherwise({redirectTo: '/login'});

我的LoginController检查用户/密码组合，并在$ rootScope上设置一个属性，以反映此情况：

function LoginController($scope, $location, $rootScope) {
 $scope.attemptLogin = function() {
   if ( $scope.username == $scope.password ) { // test
        $rootScope.loggedUser = $scope.username;
        $location.path( "/main" );
    } else {
        $scope.loginError = "Invalid user/pass.";
    }
}

一切正常，但是如果我访问http://localhost/#/main，最终将绕过登录屏幕。我想写一些类似的内容，“每当路由更改时，如果$
rootScope.loggedUser为null，则重定向到/ login”

…

…等等。我可以听路线变化吗？无论如何，我都会发布这个问题并继续寻找。

阅读 253

2020-07-04

共1个答案

一尘不染

在仔细阅读了一些文档和源代码之后，我认为我可以使用它。也许这对其他人有用吗？

我在模块配置中添加了以下内容：

angular.module(...)
 .config( ['$routeProvider', function($routeProvider) {...}] )
 .run( function($rootScope, $location) {

    // register listener to watch route changes
    $rootScope.$on( "$routeChangeStart", function(event, next, current) {
      if ( $rootScope.loggedUser == null ) {
        // no logged user, we should be going to #login
        if ( next.templateUrl != "partials/login.html" ) {
          // not going to #login, we should redirect now
          $location.path( "/login" );
        }
      }         
    });
 })

一件奇怪的事情是，我必须测试部分名称（login.html），因为“下一个” Route对象没有url或其他名称。也许有更好的方法？

2020-07-04