折线工具提示角材料

Question

我想知道是否有人知道如何在角形材质分量“工具提示”中跳线

这是我的代码：

HTML：

<mat-icon 
   [matTooltip]="getMoreInformations()"
   matTooltipPosition="left">
   myIcon
</mat-icon>

TS：

getMoreInformations(): string {
   return 'Adress : ' + this.person.adress
      + ' \n  Tel : ' +  this.person.tel;
   }

\ n和br不起作用（都尝试了）

还尝试添加这样的matTooltipClass：

HTML：

<mat-icon...
  matTooltipClass="test"
...

CSS：

.test {
  white-space: pre-line;
}

Answer 1

以下是使用您的标记/代码的示例（效果很好）-stackblitz

要使CSS正常工作，我必须将类放在文件 styles.css 中，而不是组件样式表中。摘录自 willshowell 对此问题的评论-https://github.com/angular/material2/issues/8316

编辑：以下内容适用于组件样式表

::ng-deep .test {
  white-space: pre-line;
}

documentation建议::ng-deep已过时，但仍适用于最新版本。

Answer 2

::ng-deep <tootltipCLassName>{
white-space: pre-line;
}

仍然可以在角度10下工作