ANGULAR:错误:未捕获(在承诺中):错误:无法匹配任何路由

时间:2017-11-08 16:42:42

标签: angular routing

我遇到路由问题。当我尝试导航到组件时出现错误,我无法弄清楚问题的根源是什么

这是我用于导航的功能。它位于编辑列表组件中(由路由模块中的''表示)。

displayComponent(displayMode:number, index:number){
      if(!this.emptyArray){
        this.router.navigate(['edit-list/edit', displayMode, index]);
      } else {
        this.router.navigate(['edit-list/empty']);
      }  
    }

这是我的延迟加载组件的路由模块

const recipesRoutes:Routes = [
    {path:'',   component: EditCatsComponent, children: [
        {path: 'edit/:displayMode/:id/', component: CatEditComponent},
        {path: 'new', component: CatNewComponent},
        {path: 'empty', component: NoCatComponent}
        ], canActivate:[AuthGuard]}
    ];

这是我得到的错误:

core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'edit-list/edit/1/0'
Error: Cannot match any routes. URL Segment: 'edit-list/edit/1/0'
    at ApplyRedirects.webpackJsonp.../../../router/@angular/router.es5.js.ApplyRedirects.noMatchError (router.es5.js:1466)
    at CatchSubscriber.selector (router.es5.js:1441)
    at CatchSubscriber.webpackJsonp.../../../../rxjs/_esm5/operators/catchError.js.CatchSubscriber.error (catchError.js:105)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at LastSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at ApplyRedirects.webpackJsonp.../../../router/@angular/router.es5.js.ApplyRedirects.noMatchError (router.es5.js:1466)
    at CatchSubscriber.selector (router.es5.js:1441)
    at CatchSubscriber.webpackJsonp.../../../../rxjs/_esm5/operators/catchError.js.CatchSubscriber.error (catchError.js:105)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at MapSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.error (Subscriber.js:104)
    at LastSubscriber.webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._error (Subscriber.js:130)
    at resolvePromise (zone.js:824)
    at resolvePromise (zone.js:795)
    at zone.js:873
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:425)
    at Object.onInvokeTask (core.es5.js:3881)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:192)
    at drainMicroTaskQueue (zone.js:602)
    at ZoneTask.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:503)
    at invokeTask (zone.js:1540)

1 个答案:

答案 0 :(得分:0)

尝试绝对网址:

 this.router.navigate(['/edit-list/edit', displayMode,index]);