重定向后未显示角度材料表数据

时间:2020-11-01 14:00:28

标签: angular

我有一个父级组件[route:../ register:user_id]。

“物料对话框”用于从用户那里获取搜索参数(期间以及所选期间的销售额是按个人/每日还是按月显示)。

提供搜索参数并执行onSubmit后,我想打开一个子组件并在其中显示获取的数据(有3个子组件分别用于个人/每日和每月视图)。

我第一次执行搜索时,数据已成功获取但未显示。如果再次运行查询,现在已经在子组件的路径上(例如:../ register:user_id / daily),数据将按预期显示。

对话框TS

onSubmit(value: any): void {
  //
  //
  //
  this.registerService.emitData({ user_id, shop_id, start_date, end_date } as RegisterQuery);
  this.router.navigate(['register/', user_id, endpoint]);
  this.dialogRef.close();
}

注册服务

observer = new Subject();
public subscriber$ = this.observer.asObservable();

emitData(params) {
  this.observer.next(params);
}

每日注册组件

ngAfterViewInit(): void {
  this.registerService.subscriber$.subscribe(params => {
    console.log('Received', params);
    this.getDailySales(params, 'daily');
  });
}

getDailySales(params, endpoint): void {
  this.registerService.getSales(params, endpoint)
    .subscribe(sales => {
      this.dataSource = new MatTableDataSource(sales);
      this.dataSource.sort = this.sort;
      this.dataSource.paginator = this.paginator;
      console.log(sales);
    });
}

1 个答案:

答案 0 :(得分:0)

对dataSource的引用保持不变,因此资料不知道您的源已更改。

尝试一下this.dataSource = [...this.data];

或使用BehaviorSubject,例如:

dataSource = new BehaviorSubject([]);

onAdd($event){
  this.data.push({name: this.currentText});
  console.log(this.data);
  this.dataSource.next(this.data);
}