Question

我正在使用Angular Material Mat-Table，我想在鼠标悬停在任何行上显示工具提示。基于行id，我需要从mGridDataSource匹配和过滤数据。我是Angular的新手。有人可以帮我吗？

HTML文件：

<mat-row *matRowDef="let row; columns: mGridColumns;"
     [ngClass]="{hovered: row.hovered, highlighted: row.highlighted}"
     (click)="onRowClick(mGridDataSource, row)"
     matTooltip = {{myToolTip}} (mouseover)="getToolTip(row); ">
</mat-row>

ts文件：

getToolTip(row) {

this.matTooltip = '';
   }

Answer 1

您可以直接在工具提示中访问行属性。假设您在特定的行数据对象tooltipText中具有属性row，那么您可以直接在模板中访问此属性。无需在鼠标悬停时执行一个函数来将当前工具提示存储在组件变量中。

<mat-row
  *matRowDef="let row; columns: mGridColumns;"
  (click)="onRowClick(mGridDataSource, row)"
  [matTooltip]="row.tooltipText">
</mat-row>

角材料-垫台行工具提示

1 个答案: