Angular2 路由访问被拒绝逻辑

tom*_*lex 4 angular2-routing angular2-router angular

我正在尝试对路由进行访问检查并显示访问被拒绝的页面而不是实际页面。从下面的示例中,我们可以警告路线单击时拒绝访问。我更愿意导航到实际页面,然后显示访问被拒绝。

http://plnkr.co/edit/w1NCkGs0Tv5TjivYMdvt?p=preview

假设进行访问检查的 url 是/admin/manageusers,组件名称是ManageUserComponent,如果用户没有访问权限并尝试该 url,它应该导航到该路由,/admin/manageusers 但应该显示Access Denied in the page

1.我能做的一件事是使用路由功能并获取与用户访问以及切换模板resolve相关的值。ManageUserComponent这种方法最终将在与我想要实现访问逻辑的路由相关的多个组件中具有类似的代码。

  1. 让所有component需要访问检查的地方扩展另一个base class并验证上述逻辑,如果成功则允许子组件继续。还没有弄清楚如何正确扩展另一个类

主要目标是在页面中保留访问的 url 和错误消息。并且组件函数不应该执行。

如果您能想到实施的方法和选项,请分享。

如果描述不清楚,请告诉我,我会尽力改进。

小智 5

您可以在 app-routing.module.ts 上执行类似的操作

// PRIVATE ROUTES
{
    path: 'dashboard',
    component: DashboardComponent,
    canActivate: [LoggedInGuard]
},
Run Code Online (Sandbox Code Playgroud)

然后定义这个 LoggedInGuard 服务

// PRIVATE ROUTES
{
    path: 'dashboard',
    component: DashboardComponent,
    canActivate: [LoggedInGuard]
},
Run Code Online (Sandbox Code Playgroud)

希望这可以帮助你。