向 Angular router.navigate 添加参数

Question

首先，我不确定这是否是实现我想要的正确方法.. 我正在尝试将如下导出绑定添加到 router.navigate()-method：

<call [caller]="caller"></call>

问题是我从不使用该指令，而是通过路由器对其进行寻址：

acceptCall() {
   this.router.navigate(["call"]);
}

如何在 acceptCall() 方法中实现与第一个示例相同的导出绑定？ 我已经添加了一个 Input() 变量并使用 queryParams 进行了尝试，如下所示：

@Input() caller: Caller;
acceptCall(caller) {
    this.router.navigate(["call"], {queryParams: caller});
}

但这不起作用。

Answer 1

按照我的 cmets 你必须：

1 - 重新定义您的路线

{path: 'call/:caller', component: MyComponent }

2 - 在父组件中更改导航

this.router.navigate(["call", caller]);

3 - 在子组件中，获取参数

import { ActivatedRoute } from '@angular/router';
// code until ...
myParam: string;
constructor(private route: ActivatedRoute) {}
// code until ...
ngOnInit() {
    this.route.params.subscribe((params: Params) => this.myParam = params['caller']);
}