angular - 角度路由没有传递我的参数值
问题描述
下面是我的路由器文件之一。它适用于“:id”和“:id/edit/list”,但是当我路由到
:id/edit/members => ex。本地主机:4200/bands/1/edit/members
我的解析器没有得到参数 id 值。route.params 为空。
问题- 我对 Angular 路由有点陌生,它设置正确吗?它会做我认为它会做的事吗?
const routes: Routes = [{
path: '',
component: BandsComponent
},
{
path: 'list',
resolve: {
bands: BandListResolver
},
component: BandListComponent
},
{
path: ':id',
component: BandDetailsComponent,
resolve: {
band: BandDetailResolver
}
},
{
path: ':id/edit',
component: BandEditComponent,
resolve: {
band: BandEditResolver
},
children: [{
path: 'list',
component: BandEditListComponent
},
{
path: 'profile',
component: BandEditProfileComponent
},
{
path: 'members',
resolve: {
pagination: BandEditMemberResolver
},
component: BandEditMembersComponent
}
]
},
];
这是我的解析器
export class BandEditMemberResolver implements Resolve <IUser[]> {
constructor(private bandsService: BandsService,
private alertService: AlertService) {}
resolve(route: ActivatedRouteSnapshot): Observable <IUser[]> {
return this.bandsService.getbandEditMembers(route.params.id, 1, 10).pipe(
catchError(error => {
this.alertService.danger('Problem retrieving data');
return of(null);
})
);
}
}
解决方案
很确定你只需要在route.paramMap.get('id')
这里使用,也就是:
export class BandEditMemberResolver implements Resolve <IUser[]> {
constructor(private bandsService: BandsService,
private alertService: AlertService) {}
resolve(route: ActivatedRouteSnapshot): Observable <IUser[]> {
return this.bandsService.getbandEditMembers(route.paramMap.get('id'), 1, 10).pipe(
catchError(error => {
this.alertService.danger('Problem retrieving data');
return of(null);
})
);
}
}
推荐阅读
- javascript - 根据 OPTION 标记的背景在选定的 HTML 标记上设置背景颜色
- ruby-on-rails - Ruby on Rails - reCaptcha
- python - 如何使用 Python 将列值转换为 Martix
- java - Java:如何将 txt 文件的内容复制到另一个 txt 文件中而不破坏行的外观(扫描仪)?
- ios - 更改 UITableViewCell 上的附件视图的大小
- sql - 在oracle sql中将月份和年份转换为月份的最后一天
- draftjs - 在 DraftJS 中删除块
- laravel - Laravel updateOrCreate 做一些条件
- dockerfile - 如何在 Dockerfile 中编写条件语句?
- android - 如何实现android自定义弹出菜单?