Question

我的应用程序在我的app.component.html中有一个路由器插座，但是一个名为EventDetailsComponent的嵌套组件我希望有另一个带有两个子路由的路由器插座。

简单地说，我只需要一个具有自己视图的组件（EventDetailsComponent），但也需要两个可以路由到的子视图。初始化父/子组件时，我默认导航到createSession组件

我遇到的问题是当我尝试在方法addSession（）中导航时出现此错误：

error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'events/2'

在按钮或锚标记上使用routerLink指令时，我没有遇到此问题，如下所示：<button [routerLink]="['/events/2', {outlets: {'nav': ['session']}}]"></button>

    export class EventDetailsComponent {


      constructor(private eventService:EventService,
                  private router: Router, private route: ActivateRoute) {
      }


      addSession() {
        this.router.navigate(['/events',2, {outlets: {'nav': ['session']}}]);
      }

    }

eventDetailComponent.html

    <div>
         <router-outlet name="nav"></router-outlet>
     </div>

在app.module中加载的Routes.ts中

    export const appRoutes:Routes = [
      { path: 'events', component: EventsListComponent }, 
      { path: 'events/:id', component: EventDetailsComponent, resolve: {event: EventResolver}, children:[
        {path:'event', component: createEvent, outlet:'nav' },
        {path:'session', component: createSession, outlet:'nav' }
      ] }
    ]

我真的很想知道如何在使用router-outlet时正确提供router.navigate（）的参数。特别是为什么提供父路线＆＃39; / events，2，...＆＃39;还没有找到？任何想法都将非常感激

当使用多个路由器插座时，使用路由器的导航方法时无法找到路由

0 个答案: