如何解决无法接收 Angular 路由中发送的查询参数
这是定义路由的代码:
redirect(topicname : string){
alert(topicname)
this.router.navigate(['/chapters'],{ queryParams: { topic: topicname } });
}
在我定义的 Chapters.component.ts 文件上:
export class ChapterstemplComponent implements OnInit {
topic : string;
constructor( private route : ActivatedRoute) {
this.topic= this.route.snapshot.params.topic;
alert( this.route.snapshot)
}
但是 this.topic 没有收到任何值。我想在我的 Chapters.component 的 HTML 文件中使用它。 注意:警报消息确认“topicname”在第一个片段中发送良好 但是在第二个片段中,路由没有收到任何参数 这是相同的图像:
第一个/发送警报:
解决方法
我们可以借助paramMap
获取查询参数尝试执行如下操作,这将获取ActivatedRoute 的 queryParams 订阅中的参数。
ngOnInit() {
this.route.queryParams.subscribe(params => {
this.topic = params['topic'];
});
}
您还可以在此处详细了解路由:navigate-to-other-page
快乐编码.. :)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。