angular - 单击到Angular 7中的另一个组件时从mat-table传递数据行

Question

我想将整行传递给其他组件以显示此数据，任何机构都有办法做到这一点。

html:

    <mat-row *matRowDef="let row; columns: displayedColumns;" (click)="getRecord(row)"></mat-row>

ts：

  //Get row data when the click
  getRecord(row){
      // Do somthing ..... //
  }

我会搜索很多，我找不到路。

Answer 1

单击该行后，我通过以下步骤解决了我的问题：

1. 将数据保存在服务文件中的变量中。
2. 使用导航进行路由。
3. 从服务文件中的变量中获取数据。

   public  getRecord(row : any){
    console.log(row);
     this.userservice.dataRow = row;
     this.router.navigate(['/profile']);
  }

服务文件：

    //Temporarily stores row data from mat-table
    dataRow:any;

profile.ts：

    this.dataRow = this.userservice.dataRow;

Answer 2

完成兄弟之间传递数据的方法可能不止一种，但 Angular 的方法是使用服务：https ://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-服务。

您还可以通过事件传递数据。让行单击触发父组件接收的事件，然后通过函数传递给子表的兄弟。