命名的插座沒有註冊

我想爲我的組件之一創建一個標籤組件，所以我用了命名插座來處理這個。命名的插座沒有註冊

目前，我有我的默認插座，顯示每個頁面，我想添加一個命名插座內部我的組件之一，問題是它看起來像名稱插座沒有動態註冊到OutletMap，哪個結果錯誤

Error: Cannot find the outlet tabs to load 'TabsDeaComponent'

我已經嘗試了很多東西，但我不能修復它，它只是不工作。

app.component.html

<div class="menu"> 
    <h1>Menu de recherche</h1> 

    <button (click)="search">Recherche</button> 
</div> 

<router-outlet></router-outlet>

標籤，routing.module.ts

const appRoutes: Routes = [ 
    { path: 'tabs', component: TabsComponent, pathMatch: 'full' }, 
    { path: 'tabsdea', component: TabsDeaComponent, outlet: 'tabs' }, 
    { path: 'tabsiis', component: TabsIisComponent, outlet: 'tabs' }, 
    { path: 'tabsother', component: TabsOtherComponent, outlet: 'tabs' } 
];

Tabs.component.ts

<a [routerLink]="['', { outlets: { tabs: ['tabsdea'] } }]">Ouvrir la tab DEA</a> 
<a [routerLink]="['', { outlets: { tabs: ['tabsiis'] } }]">Ouvrir la tab IIS</a> 
<a [routerLink]="['', { outlets: { tabs: ['tabsother'] } }]">Ouvrir la tab Other</a> 

<router-outlet name="tabs"></router-outlet>

正如你所看到的，命名路由器-outlet位於默認路由器插座內，在我看來，這會導致未註冊插座的問題。

Github上回購重現此問題：https://github.com/Sakuto/TabsPOC Plunkr重現此問題：http://plnkr.co/edit/P4q9yib0x9KtE15AQZAO?p=preview

更新角度問題產生https://github.com/angular/angular/issues/14051

來源

2017-01-21 Sakuto

該問題應該直接包含相關的代碼，而不僅僅是一些外部資源的鏈接。 –

完成，顯示有用的代碼。 – Sakuto

如何改變你的應用程序組件：

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 
     <router-outlet></router-outlet> 
     <router-outlet name="tabs"></router-outlet> 
    </div> 
    `, 
}) 
export class App { 
    name:string; 
    constructor() { 
    this.name = 'Angular2' 
    } 
}

請記住刪除您的標籤頁模板文件，只留下鏈接。

來源

2017-03-08 13:47:37

命名的插座沒有註冊

回答

相關問題