如果在Angle 9模板中禁用了其主机按钮，则如何启用Mat Tooltip [英] How to enable mat tooltip if its host button is disabled in angular 9 template

问题描述

我有一个按钮，仅当按钮被禁用时，我才想显示其材质工具提示.这是按钮:

I have a button that I want to display a material tooltip for only when the button is disabled. This is the button :

<button
    mat-icon-button
    #tooltip="matTooltip"
    matTooltip="Do X to create an account"
    [matTooltipDisabled]="...IDK"
    [disabled]="false"
    (click)="onAddAccountAction()"
>
<mat-icon>Add</mat-icon>
</button>

我不知道应该在 [matTooltipDisabled] 中使用什么标志/条件，以便当同一按钮的 [disabled] 属性时，工具提示不显示是真的.

I don't know what flag/condition I should use in [matTooltipDisabled] so that the tooltip is not display when the [disabled] attribute for the same button is true.

编辑

因此，我在组件文件中添加了一个属性(如下面的答案所建议)，该属性应禁用或启用工具提示，但实际上，当禁用按钮时，工具提示始终处于禁用状态.我希望专门在禁用按钮时启用工具提示.

So I added a property in my component file (as suggested in the answer below) which should disable or enable the tooltip, which it does, but the tooltip is always disabled when the button is disabled. I want the tooltip enabled specifically when the button is disabled.

推荐答案

您需要使用其他div/span包围它.每当禁用某项功能时，与其连接的所有内容都将无法正常工作.

You need to surround it with another div/span what ever. whenever something is disable nothing that connected to it is not going to work.

<span
    mat-icon-button
    #tooltip="matTooltip"
    matTooltip="Do X to create an account"
    [matTooltipDisabled]="...IDK"
>
<button
    [disabled]="false"
    (click)="onAddAccountAction()"
>
<mat-icon>Add</mat-icon>
</button>
</span>

这篇关于如果在Angle 9模板中禁用了其主机按钮，则如何启用Mat Tooltip的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！