【问题标题】:How to get row data using angular material?如何使用角度材料获取行数据?
【发布时间】:2017-12-05 18:08:48
【问题描述】:

我有 angular4 和物化表 Api,所以我试图在用户单击行时获取行数据,但它没有传递数据,我如何将数据从视图传递到组件,任何帮助将不胜感激?

app.component.html

<div class="table-container">
<mat-table>
       <ng-container matColumnDef="eventType">
            <mat-header-cell *matHeaderCellDef> Event Type </mat-header-cell>
            <mat-cell *matCellDef="let element"> {{element.eventType}} </mat-cell>
          </ng-container>
          <!--<button (click)="newMessage()" class="button">New Message</button>-->
          <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
          <mat-row *matRowDef="let row; columns: displayedColumns;" (click)="highlight(row._id,$event)"></mat-row>
        </mat-table>
      </div>

app.component.ts

highlight(id,event){
        console.log('Event',event);
    }

【问题讨论】:

  • 这显然对我有用,请在此处查看stackbiltz

标签: javascript html angularjs angular-material2


【解决方案1】:

在您的模板中更改为关注app.component.html

<mat-row *matRowDef="let row; columns: displayedColumns;" (click)="highlight(row,$event)"></mat-row>

你应该在你的组件app.component.ts中编写你的点击处理程序

highlight(row,evt) :void{
   //console.log(row,evt);
}

从您的代码中删除 ._id from (click)="highlight(row._id,$event)"。refer this

【讨论】:

  • 错误__zone_symbol__error: Error: Template parse errors: Can't bind to 'row-id' since it isn't a known property of 'mat-row'. 1
猜你喜欢
  • 2018-10-28
  • 1970-01-01
  • 2021-11-02
  • 1970-01-01
  • 2020-07-24
  • 2021-06-08
  • 2018-10-21
  • 2019-04-16
  • 2020-03-14
相关资源
最近更新 更多