时间戳

首页 > 解决方案 > 在辅助插座之间传递参数

angular - 在辅助插座之间传递参数

问题描述

我目前有一个辅助插座，它只在我的应用程序的特定区域内输出数据。这是因为我想在不更改仪表板状态的情况下操作数据。我的问题是，如何在辅助插座内的组件之间传递参数？这就是我所拥有的。

管理-clients.component.html

<div *ngFor="let police of agentPaPolicies">
<button [routerLink]="[{ outlets: {agentSidebar: ['details', police._id]}}]">View</button>
</div>

从html上面，我想/details用 param导航到路径police._id。下面的代码是我的app.routing.ts文件。

应用程序路由.ts

{ path: 'manage-clients', component:ManageClientsComponent, canActivate: [AuthGuard], data: {permission: {only:["agent"]}}, outlet: 'agentSidebar'},
 { path: 'details/:_id', component:DetailsComponent, canActivate: [AuthGuard], data: {permission: {only:["agent"]}}, outlet: 'agentSidebar'},

但是，上面的代码在我的 Web 控制台中显示错误，如下所示：

URL Segment: 'manage-clients'
Error: Cannot match any routes.

我将如何更改我的代码以正确路由它，以便在辅助插座内的两个组件之间传递参数？

标签： angularangular-router

解决方案

我并没有真正了解您的设置，但如果 manage-client 是父路由。然后你可以添加

  <router-outlet></router-outlet>

在它的 html 中并从路由 conf 中删除任何出口。如果只有一个，请跳过出口名称

任何子路由都会在那个地方注入

routeLink 将相对于“管理客户端”下方，所以如果你这样写

  <a [routeLink]=“[‘details’,Id]>Style it like a button<\a>

它应该指向 manage-client/details/1234

推荐阅读