Angular2使用2个侧边栏与路由
问题描述:
如果我有两个内容的边栏,我如何使用路由,如果它在相同的层次结构,但不在相同的元素?Angular2使用2个侧边栏与路由
我想我不能使用其他<router-outlet>
的侧边栏,因为他们是不一样的和不应该显示相同的内容
我找不出我应该怎么得到这个工作。
我想正好有左边与容器展示内容A和右侧边栏上的容器的侧边栏显示内容B
这是我app.routing.ts文件
const APP_ROUTES: Routes = [
{ path: '', redirectTo: '/Roulette', pathMatch: 'full' },
{ path: 'Roulette', component: RouletteComponent },
{ path: 'Jackpot', component: JackpotComponent },
{ path: 'Dice', component: DiceComponent },
{ path: 'Crash', component: CrashComponent },
{ path: 'Bingo', component: BingoComponent },
{ path: 'Chat', component: ChatComponent },
{ path: 'Account', component: AccountComponent }
]
答
你可以考虑使用命名的路由器出口
<router-outlet name="awesome" ></router-outlet>
和路由使用它像下面,
{
path: 'Chat',
component: ChatComponent,
outlet: 'awesome'
}
了解更多关于Displaying multiple routes in named outlets here.
入住这Plunker!!
希望这有助于!
等待,实际上工作?所以我可以在同一个component.html中使用3个插座?哇,很好,谢谢你,我现在会尝试一下,如果我能正常工作,请给我反馈。非常感谢! – Prototype
@Prototype,增加了一个Plunker的例子,干杯! –
工程就像一个魅力!非常感谢!拯救了我的一天和很多令人头疼的时刻:) – Prototype