2

我是新手Angular，我正在使用Angular-5. 在我的应用程序中，我有 2 个屏幕/组件，分别称为“ Admin-Dashboard ”和“ HR-Dashboard ”。我的默认路线是 /Admin-Dashboard查看以下路线：

const routes: Routes = [
    {
    path: 'Admin-Dashboard',
    component: AdminDashboardComponent,
    canActivate: [AuthGuard]
  },
  {
    path: HR-Dashboard',
    component:HRDashboardComponent,
    canActivate: [AuthGuard]
  }
  // otherwise redirect to home
  { path: '**', redirectTo: '/Admin-Dashboard', canActivate: [AuthGuard] }];

如果用户未登录我的AuthGaurd重定向用户到登录屏幕，则用户使用他的有效凭据登录。当用户登录时，用户用户被重定向到/即默认路由，然后自动重定向到/Admin-Dashboard。

我的问题是我必须根据他的角色（HR 或 ADMIN）重定向到登录用户。如果user.role=="ADMIN"去 Admin-Dashboard，如果 user.role=="HR" 去 HR-Dashboard。

目前我的方法是，/Admin-Dashboard由于默认路由设置，用户首先重定向到，然后在其构造函数中我检查用户角色，如果是，HR我使用重定向用户到“HR-Dashboard” router.navigate()。这工作正常，但首先在地址栏中 /Admin-Dashboard呈现，然后重定向到 HR-Dashboard。

if(this.authService.currentUser.role=='HR'){
      this.router.navigate(['HR-Dashboard']);

    }

我正在寻找一些更好的方法来实现相同的功能。有什么方法可以让我检查路由本身是管理员还是 hr 并相应地重定向？

更新：对不起，我忘了提大事，我正在使用Gluu（第三方身份验证服务器）作为身份验证服务器，它将用户重定向到我的应用程序 url（https://ip/port例如' https://192.168.55.10:4200 ') 如果用户成功登录。我没有控制从 gluu 更改导航，它只会重定向到我的默认 URL 以及用户数据。即使是登录屏幕也不是我的应用程序的一部分，它托管在 cloude 上，我使用环境配置文件重定向到登录OIDC_Settings页面AuthGaurd。

先感谢您。

4

3 回答 3

4

最好和最有效的方法是在成功登录方法时检查角色并从那里重定向到相关仪表板。

使用检查角色并相应重定向的逻辑更改您的默认重定向。

于 2018-07-04T10:29:21.487 回答
0

首先，组件的构造函数首先执行。

因此，当单击 LoginPage 中的 LOGIN 按钮时，

执行“无论他是管理员还是 hr”操作，然后将页面重定向到 ADMIN 组件或 HR 组件。

我的建议是这可能会更好。

尝试并检查。

谢谢

于 2018-07-04T10:33:00.180 回答
0

为了您的更新：

  1. 只需创建一个空组件并在构造函数中进行验证并将 URL 发送到相应的页面。

  2. JUSPAY、PAYTM 等大多数网站，在通过本网站付款时，会在一页中验证并移动到所需的 URL。

例如：如果您在 redbus 预订机票，通过 AMAZON PAY 钱包付款，您可以看到此 URL 重定向。

谢谢你。希望这会有所帮助。

于 2018-07-05T04:20:17.753 回答