如何通过角度 5 中的 routeparams 发送对象答案

【问题标题】：How to send an object via routeparams in angular 5如何通过角度 5 中的 routeparams 发送对象
【发布时间】：2018-01-11 07:11:37
【问题描述】：

我想通过 routeparams 使用 angular 5 将对象发送到另一个页面，但它不起作用。

看看我下面写的代码：

<button mat-raised-button [routerLink]="['./view-class-timing-set',newObject]">New</button>

对象的 TS 代码：

newObject = {
 id: 123
}

模块代码：

{
path: 'ng2/ClassTimingSet',
component: ClassTimingSetComponent,

children: [
  { path: '', component: NewClassTimingSetComponent},
  { path: 'view-class-timing-set/:newClassTimingObj', component: ViewClassTimingSetComponent}
]

页面路由后显示对象的 TS 代码：

 ngOnInit() {
this.route.params.subscribe(
  params =>{
    console.log('THis is the object that I got');
    console.log(params);
  }

)

}

但是，页面没有被路由它说：

 Cannot match any routes. URL Segment: 'ng2/ClassTimingSet/view-class-timing-set;id=123'

【问题讨论】：

标签： angular angular-routing routeparams

【解决方案1】：

我建议你改用queryParams。这不是您 url 中的有效对象，并且像往常一样传递对象 url 参数通常不是一个好主意。只需制作您的网址

{ path: 'view-class-timing-set', component: ViewClassTimingSetComponent}

（我们不需要指出一个路由可以有查询参数，这些通常是任意的）

然后在你的组件中：

this.route.queryParams.subscribe(
  params => {
      console.log('THis is the object that I got');
       console.log(params);
  }

然后像这样访问网址：ng2/ClassTimingSet/view-class-timing-set?id=123&key1=value1&key2=value2

【讨论】：