how to disable tooltip in angular based on condition

Question

How do we implement conditional tool tip ? , for example I only wanna show tool tip if cellData[id].length>120 on a div element

#code

<div matTooltip="Info about the action" class="{{cssCell}}">{{(cellData[id].length>120)? (cellData[id] | slice:0:120)+'..':(cellData[id]) }}</div>

Steve Holgado · Accepted Answer · 2021-11-03 21:28:57Z

1

You can use matTooltipDisabled for this:

<div
  matTooltip="Info about the action"
  [matTooltipDisabled]="cellData[id].length <= 120"
  class="{{cssCell}}"
>
  {{(cellData[id].length>120)? (cellData[id] | slice:0:120)+'..':(cellData[id]) }}
</div>

answered Nov 3, 2021 at 21:28

Steve Holgado

12.1k4 gold badges26 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to disable tooltip in angular based on condition

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related