Question

我使用自耕农生成了一个角度项目。

我有一个带有ng-view的index.html，我通过相应的控制器显示claim.html，claim-details.html，并且它们在ng-view中正确呈现。

现在，我有一个带有特定CSS的signin.html页面，它是一个完整的结构化HTML页面。我希望在用户未登录时显示此信息。一旦他通过身份验证，就应该将其重定向到上述视图之上。我该如何配置？

我跟着路由

 app.config(function ($routeProvider) {
 $routeProvider
  .when('/', {
    templateUrl: 'views/claims.html',
    controller: 'ClaimsCtrl'
  })
  .when('/signin', {
    templateUrl: 'views/signin.html',
    controller: 'SigninCtrl'
  })
  .when('/dashboard', {
    templateUrl: 'views/dashboard.html',
    controller: 'DashboardCtrl'
  })
  .otherwise({
    redirectTo: '/'
  });
 });

是否可以提一下，哪个.html应该作为ng-view的一部分呈现，哪些应该是一个独立的html文件？即我希望claim.html和dashboard.html成为ng-view的一部分，但signin.html应该是独立的

Answer 1

一种方法是使用＆＃39; $ stateChangeStart＆＃39;活动由ui-router提供转换开始时会触发此事件。您可以注入处理您的用户的服务，如果他没有登录则重定向它。这看起来像这样：

app.run（[＆＃39; $ state＆＃39;，＆＃39;会话＆＃39;功能（$ state，Session）{

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, from, fromParams){
    if (toState.name !== "login" && !Session.is_connected()) {
        $state.go("login");
        event.preventDefault();
    }

});

}]）;

此外，您还可以保存他尝试访问的最后状态，并在登录后将其重定向到该状态。

Answer 2

在AngularJs项目中，我通过在每个控制器上注入一个Authentication服务来实现这一点。在此服务中，我检查用户是否未经过身份验证或没有足够的权限，如果为true，那么我只需执行$location.url("/login");（location service docs）

如何在angularjs中有条件地显示自定义html页面和基于视图的页面

2 个答案: