xxxxxxxxxx
/*Working for Angular Material 13 */
//Add a matTooltipClass
matTooltipClass="custom-class"
matTooltip="foo\nbar\n" | matToolTip="{array.join('\n')}"
//Add the following to the component .scss
::ng-deep {
.custom-class {
white-space: pre-line;
}
}
xxxxxxxxxx
// How to set a multiline tooltip in Angular Material:
::ng-deep .my-tooltip {
white-space: pre-line;
}
/////
/* Note: You need to set matTooltipClass, not a regular class */
<span
matTooltipClass="my-tooltip"
matTooltip="Imagine there's lots of text here"
[matTooltipPosition]="'above'">
</span>