$routeProvider 中的条件表达式

Question

我有一个带有有效身份验证系统的应用程序。我这里的问题是，当用户连接时，他仍然可以通过 URL 访问登录页面。我想将所有连接的用户重定向到主页而不是登录页面。

所以，当有人要求 /authentication/login:

如果用户已连接，他将被重定向到 /home。
如果没有人连接，则可以访问 authentication/login。

这是我的实际工作代码（它不会将连接的用户重定向到主页）。

angular.module('authentication').config(RouteConfig);
RouteConfig.$inject = ['$routeProvider', 'UserSession'];

function RouteConfig($routeProvider, UserSession) {
    $routeProvider.when('/authentication/login/', {
        templateUrl: 'section/authentication/login.tmpl',
        controller: 'LoginController',
        controllerAs: 'lo'
    });
}

是否可以在上面的代码中加入条件语句？类似于：

$routeProvider.when('/authentication/login/', {
    if(UserSession.getUser() != null) {
        // Go to Home page instead
    } else {
        // Normal way
    }
});

Answer 1

你可以这样做条件语句。

angular.module('authentication').config(RouteConfig);
RouteConfig.$inject = ['$routeProvider', 'UserSession'];

function RouteConfig($routeProvider, UserSession) {
 $routeProvider.when('/authentication/login/', {
    templateUrl: 'section/authentication/login.tmpl',
    controller: 'LoginController',
    controllerAs: 'lo',
    resolve: {
      factory: checkRouting
    }
 });
}


var checkRouting= function ($q, $rootScope, $location) {
  if ($rootScope.userProfile) {
    return true;
  } else {
    var deferred = $q.defer();
    $http.post("/yourUrl",data)
        .success(function (response) {
            $location.path("/login");
            deferred.resolve(true);
        })
        .error(function () {
            deferred.reject();
            $location.path("/home");
         });
    return deferred.promise;
  }
 };

Answer 2

你可以用这个。

  $routeProvider.when('$routeProvider.',
    {
      redirectTo: function (routeParams, path, search) {
        console.log(routeParams);
        console.log(path);
        console.log(search);
        return "/";
      }
    })

尝试在 return 语句中有条件地 return 主路由。有关详细信息，请参阅 $routeProvider docs or look here at Thinkster

中的 redirectTo

Answer 3

我的一个 Angular 应用程序中有一个非常相似的方法。在路由的配置中，您可以添加任何您喜欢的密钥，并使用 $routeParams 服务访问这些密钥。

所以对于你的例子：

function RouteConfig($routeProvider, UserSession) {
    $routeProvider.when('/authentication/login/', {
        templateUrl: 'section/authentication/login.tmpl',
        controller: 'LoginController',
        controllerAs: 'lo',
        blockAuthenticated: true // <-- add a new flag, something like this 
    });
}

然后在您的应用程序中其他最合适的地方，例如module.run()

function run($location, $routeParams, UserSession)
{
    // redirect the user home if they're logged in and the route doesn't allow
    // authed users

    if ($routeParams.blockAuthenticated && UserSession.getUser() != null) {
        $location.path('/home');
    }
}

Answer 4

你可以将下面的代码理解为：

On every route change, "if a connected user wants to access /authentication/login/, then he will be redirect to /home".

angular.module('authentication').run(function($rootScope, $location, Session) {
    $rootScope.$on("$routeChangeStart", function(event, next, current) {
        if(Session.getUser() != null && next.$$route.originalPath == '/authentication/login/') {
            $location.path("/home");
        }
    });
});

此解决方案的灵感来自 @st.never's answer on this question。

$routeProvider 中的条件表达式

Conditional expression in $routeProvider

authentication

session

angularjs

angular-routing