Question

示例：www.example.com/dashboard
我想检测用户是否为Customer，它将加载CustomerDashboardModule，如果用户为Staff，则为StaffDashboardModule，如果用户为Admin，则为AdminDashboardModule但url仍为/ dashboard

示例代码：

export const routes: Routes = [
{
    path: '',
    component: DashboardComponent,
    children: [
        {
            path: '',
            loadChildren: condition ? 'x' : 'y'
        }
    ]
}];

但它不起作用。

第二个问题是如何检测用户？调用CoreModule的服务。一个解决方案是在CoreModule中创建一个静态属性Injector，并在其构造函数中注入Injector，但我不知道它是否是一个好习惯？

Answer 1

您可以使用警卫，只有当您有权访问该路线时，您才能导航到该网址，否则，您可以重定向到其他网址。

Angular Router goto 'Milestone 5: Route guards'

示例在路由器配置中定义一个保护：

const routes: Routes = [
  {
    path: 'adminDashboard',
    component: AdminComponent,
    canActivate: [AdminAuthGuard],
    children: [
      {
        path: '',
        children: [
          { path: '', component: AdminDashboardComponent }
        ],
      }
    ]
  },
  {
    path: 'userDashboard',
    component: UserComponent,
    canActivate: [UserAuthGuard],
    children: [
      {
        path: '',
        children: [
          { path: '', component: UserDashboardComponent }
        ],
      }
    ]
  },
];

带重定向的警卫示例：

@Injectable()
export class AdminAuthGuard implements CanActivate {

auth: any = {};

constructor(private authService: AuthService, private router: Router) {}

canActivate() {
    if (/*user has privileges check*/) {
        this.router.navigate(['/adminDashboard']);
        return true;
    }
    else {
        this.router.navigate(['/userDashboard']);
    }
    return false;
  }
}

关于您的第二个问题，使用登录来检测登录用户并将逻辑放入服务中以获取登录句柄和其他服务，以检查您在后端配置的用户权限。如果您的应用程序通过互联网，请使用https发送安全用户凭据。

Angular2 - 调整loadChildren以加载指定的模块，但使用相同的路由URL

1 个答案: