导航到routerLink属性的辅助路由URL

Angular支持将主路由作为字符串属性。导航到routerLink属性的辅助路由URL

即

<button routerlink="/path1">Click Me!</button>

然而，当有多个网点，添加辅助路线不工作：

<button routerlink="/path1(foo:/path2)">Click Me!</button> <<-- does not work

有没有一种方法，使这项工作？

注：我意识到其可能与实现这一目标：

<a [routerLink]="['/path1', { outlets: { foo: '/path2' } }]">Click Me!</a>

我的问题更多的是这是否可能使用普通字符串属性（路由器框架可以分析它在幕后）。

来源

2017-07-30 pixelbits

我想你也可以使用[** navigateByUrl **]（https://angular.io/api/router/Router/#usage-2）像这样'router.navigateByUrl（“/ path1/foo/path2“）;' –

嘿，没有[我的回答]（https://stackoverflow.com/a/45396457/2545680）有帮助吗？ –

目前的路由器实现似乎不可能。当你传递一个字符串到routerLink它被包裹成一个阵列的位置：

@Directive({selector: ':not(a)[routerLink]'}) 
export class RouterLink { 
    ... 

    } 

    @Input() 
    set routerLink(commands: any[]|string) { 
    if (commands != null) { 
     this.commands = Array.isArray(commands) ? commands : [commands]; <--------------- 
    } else { 
     this.commands = []; 
    } 
    }

而且here is功能，试图从中解析包裹commands和提取物出口：

function getOutlets(commands: any[]): {[k: string]: any[]} { 
    if (!(typeof commands[0] === 'object')) return {[PRIMARY_OUTLET]: commands}; 
    if (commands[0].outlets === undefined) return {[PRIMARY_OUTLET]: commands}; 
    return commands[0].outlets; 
}

正如你可以看到，如果包裹的commands内的值不是一个对象 - 这是您的情况，它始终默认为primary outlet，并将该值用作此主要插座的路径：

if (!(typeof commands[0] === 'object')) return {[PRIMARY_OUTLET]: commands};

来源

2017-07-30 04:43:51

很久以前我调查过它，看起来你是对的。我们不能在'routerLink'中使用字符串来导航到'outlets'路径，但是可以通过数组完成 – yurzui

导航到routerLink属性的辅助路由URL

回答

相关问题