簡體   English   中英

Angular2 RC5 | 路由器:無法匹配任何路由

[英]Angular2 RC5 | Router: Cannot match any routes

我目前在路由器 3.0.0 RC1 上使用 Angular 2 - RC5。 這似乎是一個非常常見的錯誤,但我找不到任何有效的解決方案。 我的組件結構包括一個“BasicContentComponent”,其中包括主菜單和標題以及子路由內容的輔助出口。 “BasicContentComponent”來自共享模塊,子路由組件來自該子路由的特定模塊。

我的路線配置看起來像這樣

export const routeConfig = [
    {
        path: 'home',
        component: BasicContentComponent,
        children: [
            {
                path: '',
                component: HomeContainer,
                //canActivate: [IsAuthenticatedGuard],
                outlet: 'content', // REMOVE THIS LINE
                //resolve: {
                //    homeState: HomeResolver
                //}
            }
        ]
    }
];

如果我刪除“children”定義,我可以加載“/home”,但是使用此配置我會收到錯誤消息。

以下是模塊配置,因為問題也可能出在那里。

app.module.ts

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,

    RouterModule.forRoot(routeConfig), //see above
    SharedModule.forRoot(),
    HomeModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

共享模塊.ts

import { Store, StoreModule } from '@ngrx/store';

@NgModule({
    imports: [
        RouterModule,
        CommonModule,
        ...

        StoreModule.provideStore(reducers),
    ],
    declarations: [
        BasicContentComponent,
        ...
    ],
    exports: [BasicContentComponent, ...],

})
export class SharedModule {

    static forRoot() : ModuleWithProviders {
        return {
            ngModule: SharedModule,
            providers: [
                MdIconRegistry,
                ...
                IsAuthenticatedGuard,
                ...
                HomeResolver
            ]
        }
    }
}

home.module.ts

@NgModule({
    imports: [CommonModule, SharedModule],
    declarations: [
        HomeContainer,
        HomeComponent
    ],
    exports: [HomeContainer]
})
export class HomeModule { }

我收到以下錯誤

browser_adapter.js:84 例外:錯誤:未捕獲(承諾):錯誤:無法匹配任何路由:'home'

知道可能是什么問題嗎? 是路由配置還是模塊問題? 謝謝

編輯我忘記了模板:

應用程序組件.html

<div>
  <router-outlet></router-outlet>
</div>

基本內容.component.html

<md-sidenav-layout fullscreen>
  <md-sidenav mode="side" align="start" [opened]="isOpened$ | async" color="warn">
    <mainnav-container></mainnav-container>
  </md-sidenav>

  <page-header-container></page-header-container>

  <div class="app-content">
    <router-outlet name="content"></router-outlet> // REMOVE NAME
  </div>

</md-sidenav-layout>

我在 Gitter 上得到了幫助。 如果我刪除路由器插座的“名稱”屬性並將其從 routerConfig 中刪除,則一切正常。 我不完全理解為什么我必須刪除它以及路由器如何找到正確的插座 - 因為插座是嵌套的,所以有點道理 - 但我會在稍后更新我的答案,當命名插座的文檔更多時完全的。

感謝 Gitter 上的 @DzmitryShylovich。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM