通过 routerLink 定位命名出口会添加无关的“/"； [英] Targeting named outlet via routerLink adds extraneous "/"
问题描述
我正在尝试通过路由在我的应用中启动模式.除了在 URL 中添加了一个额外的斜杠以防止其解析之外，一切似乎都有效.Url 应该是这样的(如果我手动输入它就可以工作)...
I'm trying to launch a modal in my app via routing. Everything seems to work except that an extra slash is added to the URL that prevents it from resolving. The Url should look like this (and it works if I enter it manually)...
/accounts(modal:accounts/1/edit)
但我得到了这个(注意基本网址和出口目标之间的斜线)...
but i'm getting this instead (notice the slash between the base url and outlet target)...
/accounts/(modal:accounts/1/edit)
基础标签已设置...
<head>
<meta charset="utf-8">
<title>myApp</title>
<base href="/">
...
</head>
这是我的路由配置 (accounts-routing.module.ts)
Here's my routing config (accounts-routing.module.ts)
const ACCOUNT_ROUTES: Routes = [
{
path: 'accounts',
component: AccountsIndexComponent
},{
path: 'accounts/new',
component: AccountsNewComponent
},{
path: 'accounts/:id',
component: AccountsShowComponent
},{
path: 'accounts/:id/edit',
component: AccountsEditComponent,
outlet: 'modal'
}
];
和插座(app.component.html)
And outlet (app.component.html)
<router-outlet></router-outlet>
<router-outlet name="modal"></router-outlet>
还有链接……
<a [routerLink]="[{ outlets: { modal: ['accounts', account.id, 'edit'] } }]">Edit</a>
我错过了什么?该项目是使用 angular-cli@1.0.0-beta.26 和 angular@2.4.6 和 angular-router@3.4.6 已安装.
What am I missing? The project was created using angular-cli@1.0.0-beta.26 and angular@2.4.6 and angular-router@3.4.6 are installed.
FWIW，这是日志的屏幕截图...
FWIW, here's a screenshot of the logs...
推荐答案
修复是在链接上定义一个空的相对路径.感谢@unitario 为我指明了正确的方向！
The fix was to define an empty relative path on the link. Thanks to @unitario for pointing me in the right direction!
<a [routerLink]="['', { outlets: { modal: ['accounts', account.id, 'edit'] } }]">Edit</a>
这篇关于通过 routerLink 定位命名出口会添加无关的“/"；的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
