Home > front end >  How to use mattooltip?
How to use mattooltip?

Time:09-07

How can I use mattooltip for here? It does not work.

 <div  matTooltipClass="custom-tooltip" 
 (click)="edit(row.widgetAccess)"  title=" 
 {{getTitle(row.widgetAccess.widgets.length)}}">

.custom-tooltip {
background-color:pink;
}

CodePudding user response:

material tooltips need the matTooltip property set. It will not work with title.

<button mat-raised-button
        matTooltip="Info about the action"
        aria-label="Button that displays a tooltip when focused or hovered over">
  Action
</button>

Source

CodePudding user response:

Try this way [matTooltip]="PropertyName" instead of title=" {{getTitle(row.widgetAccess.widgets.length)}}"

Working example is here : https://stackblitz.com/edit/angular-mat-tooltip-2b4fqy?file=main.ts,app/tooltip-overview-example.ts,app/tooltip-overview-example.html,app/tooltip-overview-example.css

Refer below screen shots HTML File and TS

  • Related