如果用户登录AngularJS,则重定向索引页面

ror*_*den 20 angularjs angular-routing

我试图改变用户访问我的网站时看到的页面.如果他们是匿名的,他们应该看到注册页面.如果他们已登录,他们应该看到他们的仪表板.

我有一个服务,它检查用户是否登录(例如检查cookie),当Angular服务加载时触发.我试图使用$ routeProvider重定向但是在初始化$ routeProvider时没有触发服务,所以它总是认为用户没有登录.

一旦加载了初始页面,我就可以轻松地重定向,但是我很难重定向加载的第一页.任何人都可以就如何做到这一点提出建议吗?

小智 20

请务必阅读答案下的评论.当我回答这个问题时,我没有考虑过单元测试和设计.我只是在证明什么是实现预期结果的众多方法之一

我认为在控制器或你的控制下做最好的方法app.config.run.在您的情况下,您应该创建另一个模块来检查用户登录状态.将用户登录状态检查模块注入您的应用程序模块.

以下是app.js代码后跟示例的链接

http://plnkr.co/edit/dCdCEgLjLeGf82o1MttS

var login = angular.module('myLoginCheck', [])
  .factory('$logincheck', function () {
    return function (userid) {
      // Perform logical user logging. Check either 
      // by looking at cookies or make a call to server.
      if (userid > 0) return true;
      return false;
    };
  });

var app = angular.module('myApp', ['myLoginCheck']);

app.config(function ($routeProvider, $locationProvider) {
    $routeProvider
      .when('/publicurl', {})
      .when('/loginurl', {})
      .when('/unauthorize', {})
      .otherwise({redirectTo: '/'});
  })
  .run(function ($logincheck, $location) {
    //console.log("Into run mode");
    console.log("Userid 5 is logged in: ", $logincheck(5));
    console.log("Userid 0  logged in: ", $logincheck(0));

    //now redirect to appropriate path based on login status
    if ($logincheck(0)) {
      //$location.path('/loginurl'); or          
    }
    else {
      //$location.path('/publicurl'); or 
    }
  });

app.controller('MainCtrl', function ($scope) {
  $scope.name = 'World';
});
Run Code Online (Sandbox Code Playgroud)

  • 我不确定使用app.run是个好主意; 这违背了angular的解耦方法并且使应用程序难以测试 - 每次在测试中加载app模块时,它都会尝试登录你!当然你可以实际登录你的测试,但如果你不必登录会更好. (4认同)