角度路线或子组件

Question

我正在为旅程实体创建 CRUD，并在 Angular 中创建两个组件。

• 列表
• 编辑

该列表从服务获取所有旅程并显示它们。 编辑有一个表单，如果传递了旅程 ID，它将添加新的旅程或编辑旅程。

我有很多实体，并且正在使用带有 url 参数的路由来实现这一点：

<a mat-button [routerLink]="['/journey-edit', journey.id]">{{journey.name}}</a>

我现在已经发现了子组件，我可以在其中将旅程从列表传递到编辑，然后隐藏列表：

<app-journey-view *ngIf="currentJourney" [journey]="currentJourney"></app-journey-view>

现在我被困住了。我该以哪种方式继续？

• 我是否需要路由
• 我可以将路由与子组件混合使用吗

• 身份验证在我的路由上。这是否适用于子组件：

  {
  path: 'journey-list',
  component: JourneyListComponent,
  canActivate: [AuthGuardService]
  },
  

此应用将具有许多实体，并且大多数实体将通过关系数据库进行链接。

Answer 1

只需使用路由。如果隐藏列表，则无法从 url 访问特定项目。

{ 
path: 'journey',
children:[
{ path: 'journey-list', component: JourneyListComponent},
{ path: ':id', component: JourneyDetailComponent},
{ path: 'edit/:id', component: JourneyEditComponent}
]
}