我想要一个Enter-comp . 作为概述和基本上两个孩子comp . 例如login-and register-comp . 此外,我想用多个路由器插座来管理它 . 但是"of course"它还没有用 . 它让我一扔: Error: Cannot match any routes. URL Segment: ',%20%7Boutlets:%20%7Blogin:%20%5B'login'%5D%7D%7D'
App路由配置
const routes: Routes = [
{path: 'stories', component: StoriesComponent},
{path: '', component: EnterOverviewComponent, children: [
{path: 'login', component: LoginComponent, outlet: 'login'},
{path: 'register', component: RegisterComponent, outlet: 'register'},
]}
];
App-root
<app-navbar></app-navbar>
<router-outlet></router-outlet>
<router-outlet name="login"></router-outlet>
<router-outlet name="register"></router-outlet>
Navbar comp .
期待这里的错误 . 我怀疑,我称之为虚假路线:
<ul class="navbar-nav ml-auto">
<li class="nav-item" routerLinkActive="active">
<a class="nav-link" routerLink="/, {outlets: {login: ['login']}}">Sign In</a>
</li>
<li class="nav-item" routerLinkActive="active">
<a class="nav-link" routerLink="/, {outlets: {register: ['register']}}">Register</a>
</li>
</ul>
1 回答
问题是您正在尝试将辅助路线作为字符串发送 .
routerLink
将RHS上的值计算为字符串 . 这就是你在路线上看到奇怪角色的原因 . 要使这项工作,你需要尝试如下 -在你的情况下
EDITED
相对于ROOT路线命名的儿童出口不起作用,看起来像BUG
comments section中提到了一种解决方法 .
OR
你可以改变下面的配置 -