Angular2 EXCEPTION：錯誤：未捕獲（承諾）：錯誤：無法匹配任何路線：

當我使用router.navigateByUrl方法時，我目前遇到我的Angular2應用程序出現問題。我有一個在我的組件調用goToRoute功能，它看起來像這樣：Angular2 EXCEPTION：錯誤：未捕獲（承諾）：錯誤：無法匹配任何路線：

router.goToRoute(route:string, event?:Event):void { 
     if (event) { 
      if (event.defaultPrevented) { 
       return; 
      } 
      event.preventDefault(); 
     } 

     this.router.navigateByUrl(route); // prefixing with '/' does nothing here... 
     // if the menu has been clicked and it was open close it! 
     if (this.menuOpen) { 
      this.toggleHamburger();

}}

我會在我的HTML像這樣使用在ngFor ...

<div *ngFor="let route of routes "> 
    <div (click)="goToRoute(route.path, $event)"> {{ route.display }} </div> 
</div>

現在當我點擊一個div我得到的錯誤：

EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: 'about-us' 
zone.js:461 Unhandled Promise rejection: Cannot match any routes: 'about-us' ; Zone: angular ; Task: Promise.then ; Value: Error: Cannot match any routes: 'about-us'(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:463 Error: Uncaught (in promise): Error: Cannot match any routes: 'about-us'(…)

這是奇怪，因爲在我的路線，我有以下（DisplayRoutes是我通過擴展路由對象進行自定義類型）：

export const routes:DisplayRoutes = [ 
    { 
     path: '', 
     display: 'Home', 
     component: HomeComponent 
    }, { 
     path: 'about-us', 
     display: 'About us', 
     component: LeftSubNavigation, 
     index: { 
      component: DetailMoreLayout 
     }, 
     children: [ 
      { 
       path: ':id', 
       component: DetailMoreLayout 
      } 
     ] 
    }, { 
     path: 'teams', 
     display: 'Teams', 
     component: LeftSubNavigation, 
     index: { 
      component: DetailMoreLayout 
     }, 
     children: [ 
      { 
       path: ':id', 
       component: DetailMoreLayout 
      } 
     ] 
    } 
];

正如你可以看到我有一個名爲「關於美」路線！出於某種原因，儘管名稱匹配的路徑不匹配？我把控制檯登錄我goToRoute方法輸出route和event看到正在通過什麼......我這...

about-us MouseEvent {isTrusted: true, screenX: 1809, screenY: 382, clientX: 42, clientY: 144…}

我目前從"@ngrx/router": "^1.0.0-beta.1"切換到"@angular/router": "3.0.0-beta.2"。我有一個基本標記，當我使用router.navigateByUrl時，事情似乎會崩潰。然後我注意到，如果我深入鏈接，會發生同樣的情況，例如當我在瀏覽器中訪問http://localhost:4200/about-us時。

任何意見表示讚賞。

來源

2016-08-02 Mark Sandman

好吧，所以它不是前綴'/'，我沒有建議，然後，對不起:) –

你必須在那裏有前綴'/'。

其次，由於關於我們是非終止路線（有子女），您需要定義一個具有''(empty)路徑的子女。它可能會重定向到任何現有的路由。

{path: '', redirectTo: 'other-path', pathMatch: 'full'}

其次我假設你的擴展將負責顯示和索引var在配置中，因爲它不在默認路由類型中。

看一看官方tutorial

另一個問題，所以詳細介紹瞭如何使用multi level routing。

來源

2016-08-02 17:25:22

您好，前綴創建一個錯誤，但我認爲添加重定向已使路由功能。 –

Angular2 EXCEPTION：錯誤：未捕獲（承諾）：錯誤：無法匹配任何路線：

回答

相關問題