在Angular 4中使用ID进行路由

发布时间：2020-12-17 17:05:08 所属栏目：安全来源：网络整理

导读：我在Angular 4中的路由中需要帮助.我想显示这样的URL. Localhost：4200 / user / 1如果我点击了第一个用户的查看详细信息.我对如何做到这一点有点困惑.我已经在下面的代码中尽了最大努力,但它仍然不起作用. app-routing.module.ts const appRoutes: Routes =

我在Angular 4中的路由中需要帮助.我想显示这样的URL. Localhost：4200 / user / 1如果我点击了第一个用户的查看详细信息.我对如何做到这一点有点困惑.我已经在下面的代码中尽了最大努力,但它仍然不起作用.

app-routing.module.ts

const appRoutes: Routes = [
    { path: '',redirectTo: '/dashboard',pathMatch: 'full' },{ path: 'dashboard',component: DashboardComponent },{ path: 'user',component: UserComponent,children: [

        { path: 'create-new-user',component: CreateNewUserComponent },{ path: 'user-list',component: UserListComponent },{ path: 'user-detail/:id',component: UserDetailComponent },]},];


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

}

解决方法

我认为你的ViewDetail()方法需要一个索引参数.
例如

public ViewDetail(index: number)
{
  this.index = index;
  ...
}

路由本身有一个很好的例子here.
他们使用以下路由定义：

const routes: Routes = [
  ...
  { path: 'detail/:id',component: HeroDetailComponent },...
];

至于打字稿代码.

gotoDetail(): void {
  this.router.navigate(['/detail',this.selectedHero.id]);
}

所以,我认为你在那里正确.

我认为这只是没有设定的指数.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!