通过routerLink将父组件数据传递给子组件

Question

我有一个父组件，在html模板中有一个这个按钮：

<button class="button" [routerLink]="['/modify-alias-detail']">Next</button>

以上似乎可以正常工作，因为我得到edit-alias-detail works!输出。 但我想将一些数据从父组件传递给子组件，所以我尝试了这个：

<button class="button" [routerLink]="['/modify-alias-detail', aliasName.value]">Next</button>

我在开发者控制台中收到此错误：

EXCEPTION: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'modify-alias-detail//'

我之前没有使用过routerLinks，而且我对angular 2更新。

任何帮助都表示赞赏。谢谢！

Answer 1

以这种导航方式，您可以传递queryParams

<button class="button" (click)="goToAliasDetails(aliasName.value)">Next</button>

然后在.ts

goToAliasDetails(aliasName: string) {
    this.router.navigate(['/modify-alias-detail'], {queryParams: {aliasName}});
}

但最后您的网址将如下所示：/ modify-alias-detail？aliasName = ....