3

所以，我正在构建一个 Angular 4 应用程序，我希望所有路由都受到保护（当然登录路由除外）。我正在尝试使用功能模块和功能模块路由。所以，想象一下这样的事情：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { AuthGuardService } from './auth/auth-guard.service';
import { LoginComponent } from './login/login.component';
import { RegisterComponent } from './register/register.component';
import { ProtectedRouteComponent } from './protected-route/protected-route.component';

const routes: Routes = [
  { path: 'login', component: LoginComponent }, // no auth guard for login
  {
    path: '',
    canActivate: [AuthGuardService],
    children: [
      {
        path: '',
        children: [
          { path: 'register', component: RegisterComponent },
          { path: 'protected', component: ProtectedRouteComponent }
        ]
      }
    ]
  }
];

@NgModule({
  imports: [ RouterModule.forRoot(routes) ],
  exports: [ RouterModule ]
})
export class AppRoutingModule {}

，对于根模块，然后是用户功能模块路由配置，例如：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { UsersComponent } from './users.component';

const routes: Routes = [
  { path: 'users', component: UsersComponent }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class UsersRoutingModule {}

什么是最好的方法：

  • 继续使用功能模块路由，并且
  • 将路由保护应用于用户功能模块路由而不复制 canActivate 保护？有什么方法可以将它从根路由模块传递给用户功能模块路由？

谢谢，
伊拉克利斯

4

1 回答 1

0

正在寻找相同的解决方案，我找到的解决方案涉及以下步骤：

  • 不要通过应用模块导入您的功能模块
  • 而是将功能模块作为应用模块路由的一部分导入
{
    path: '',
    canActivate: [AuthGuardService],
    children: [
      {
        path: '',
        children: [
          { path: 'register', component: RegisterComponent },
          { path: 'protected', component: ProtectedRouteComponent }
        ]
      },
      {
        path: '',
        children: () => UsersModule
      }
    ]
  }

需要考虑的一件事：

  • 其他模块将无法访问您的 UserModule 的组件和服务（直到您访问了其中一条/users路线）
  • 这可能不是问题，因为您的模块可能已经很好地分开了
于 2019-11-22T08:19:17.923 回答