Question

我想从工具提示按钮中调用方法selections（），该方法执行某项操作并返回一个在悬停工具提示时需要显示的字符串。我尝试在html上插入返回的值，但是没有用

app.component.html

<button mat-raised-button
      matTooltip={{selections()}}
      matTooltipClass = "test"
      aria-label="Button that displays a tooltip when focused or hovered 
      over">
Action
</button>

需要从函数返回字符串“ selected”，并将其显示在悬停工具提示上

app.component.ts

selections() {
this.selectedelems = [];
this.selection.selected.map(id => this.tableData.data.filter((row: any) => 
{
  if (row._id === id) {
    this.selectedelems.push(row.name);
    this.selected = this.selectedelems.join('\r\n');
    }
}));
return this.selected;
}

Answer 1

您需要通过属性绑定使用模板表达式。以下代码应调用您的方法并接收返回的字符串。

<button mat-raised-button
      [matTooltip]="selections()"
      matTooltipClass = "test"
      aria-label="Button that displays a tooltip when focused or hovered 
      over">
Action
</button>

以下链接是有关模板表达式的信息

https://angular.io/guide/template-syntax#template-expressions

以下链接是有关属性绑定的信息

https://angular.io/guide/template-syntax#property-binding

请注意：

尽管这也是通过以下方式填充工具提示的可行解决方案组件方法，根据下面的评论，这不是根本问题这个问题，插值将在这种情况下工作也一样matTooltip="{{selections()}}"

角垫工具提示调用函数

1 个答案: