Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/31.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular 角度4-使用导航路由器发送对象作为参数_Angular_Primeng Datatable - Fatal编程技术网

Angular 角度4-使用导航路由器发送对象作为参数

Angular 角度4-使用导航路由器发送对象作为参数,angular,primeng-datatable,Angular,Primeng Datatable,我用Ngprime Datatable创建了一个html表,当我在一行中单击时,抛出下一个路由: // First component onRowSelect(event) { console.log(event.data); // for the moment everything is ok this.router.navigate(['/search/' + event.data]); } 在event.data中,我选择了html表中的register

我用Ngprime Datatable创建了一个html表,当我在一行中单击时,抛出下一个路由:

// First component
    onRowSelect(event) {
    console.log(event.data); // for the moment everything is ok
    this.router.navigate(['/search/' + event.data]);    
}
在event.data中,我选择了html表中的register json,如果我在console.log中显示event.data的内容,就会看到具体的json寄存器

问题是,当我试图从试图获取json的组件获取json时,它无法正常工作,它将其检测为对象,但我看不到对象内容

// Second component
this.activatedRoute.params.subscribe((params: Params) => {
    let newRow  = params['newRow'];
    if(newRow) {
    console.log("newRow:", newRow); // This console shows "newRow: [object Object]", here I have the problem
    }
});
这是我在路由文件配置中的路径:

const appRoutes: Routes = [
  {
    path: 'search/:newRow',
    component: MainComponent
  }
];

有什么问题吗?

我想最好的办法是将其字符串化,然后在另一个组件上解析它:

this.router.navigate(['/search/' + JSON.stringify(event.data)]);
onRowSelect(event) {
    console.log(event.data); // for the moment everything is ok
    this.rowDetailService.setRowDetail(event.data);
    this.router.navigate(['/search/detail']);    
}
this.rowDetailService.rowDetail$.subscribe(row => {
    console.log(row); // do whatever with it
});

您试图发送路由参数中的复杂对象,请不要这样做。路由器正在调用默认的to string方法,该方法正在销毁您的数据。而是使用共享服务:

@Injectable()
export class RowDetailService {
    rowDetailSource: BehaviorSubject<any> = new BehaviorSubject(null);
    rowDetail$: Observable<any> = this.rowDetailSource.asObservable();
    setRowDetail(detail:any) {
        this.rowDetailSource.next(detail);
    }
}
然后在第二部分:

this.router.navigate(['/search/' + JSON.stringify(event.data)]);
onRowSelect(event) {
    console.log(event.data); // for the moment everything is ok
    this.rowDetailService.setRowDetail(event.data);
    this.router.navigate(['/search/detail']);    
}
this.rowDetailService.rowDetail$.subscribe(row => {
    console.log(row); // do whatever with it
});

或者更好的做法是将参数设置为该数据的唯一标识符,并使用与表相同的数据源来检索该行。

可能执行console.lognewRow:,JSON.parsenewRow;??我之前测试过它,并给出了下一个错误:error SyntaxError:JSON中的意外标记o位于位置1so JSON数据@Eladerezador有问题您不应该尝试将复杂对象放入路由参数中,请使用共享服务将其从一个组件发送到另一个组件。@Eladerezador您能给出一个用例吗?