Angular 2路由器 – 命名出口

发布时间：2020-12-17 08:51:25 所属栏目：安全来源：网络整理

导读：文档不是很好,但我试图在同一页/路由上有不同的路由器出口. 我的app.component.html中有这个 router-outlet/router-outletrouter-outlet name="dashboard"/router-outlet 我的app.routes.ts { path: '',component: HomeComponent,outlet: 'primary'},{ path:

文档不是很好,但我试图在同一页/路由上有不同的路由器出口.

我的app.component.html中有这个

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

我的app.routes.ts

{
    path: '',component: HomeComponent,outlet: 'primary'
},{
    path: '',component: DashboardComponent,outlet: 'dashboard'
},{
    path: '**',redirectTo: '404'
}

所以在我的首页上(即“example.com”,而非“example.com;仪表板：仪表板”)我想在主路由器插座中显示Home组件,在显示板插座中显示我的Dashboard组件.这适用于ngrs / router,但由于它已被弃用,我正在尝试迁移.没有仪表板：角度/路由器中的仪表板是否可能？

有了这个配置,我正被重定向到404.我也试过这个没有运气：

{
    path: '',children: [
        {
            path: '',outlet: 'dashboard'
        }
    ]
},

有没有人设法让命名的路由器插座工作？

UPDATE
关于从ngrx / router到angular / router的迁移说明,你应该能够：

{
    path: 'blog',outlet: 'main'
},{
    path: 'blog',component: RegisterComponent,outlet: 'dashboard'
}

但是当我访问example.com/blog时,我在控制台中收到此错误：

Error: Cannot match any routes: ‘blog’

https://github.com/ngrx/router/blob/master/docs/overview/migration.md

试试这个配置：

{
    path: 'wrap',children: [
        {
            path: 'dash',outlet: 'dashboard'
        }
    ]
}

有：

this.router.navigateByUrl('/wrap(dashboard:dash)');

我不知道为什么需要一个url片段(比如我添加的“wrap”)但是它有效……

和其他人：

{
    path: 'blog',outlet: 'dashboard'
}

有：

this.router.navigateByUrl('/(main:blog)');
this.router.navigateByUrl('/(dashboard:blog)');

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!