Css Can'；t做多行matTooltip，总是得到单行

使用[matTooltip]=“myMultiLineStringGenerator（）”结合[matTooltipClass]=“my-tooltip”“”，我本来希望给我多行工具提示，不管我是谁，只要我得到一行工具提示，我就无法控制行结束并移动到下一行

复制步骤

HTML部分

<p  [matTooltipClass]="'my-tooltip'"
    [matTooltip]="getTooltopScript(nearestStations)">
            Hello World!
</p>

打字稿

getTooltopScript(ns: any[]]){
      let part1 =  ns[0]['stationName'] ;
      let part2 = ns[0]['regionName'];
      return `${part1}.\r\n\
       ${part2}.`;
}

我读过很多其他的堆栈流，它们的结尾都使用空格：css中的pre-line，以及js\type脚本中的

\r\n

来创建字符串。我不知道我还应该做些什么才能使它起作用

请帮忙：）

从其他Stackflow更新CSS，并在下面给出第一条注释。我还是没有结果

::ng-deep .mat-tooltip .cdk-overlay-container, ::ng-deep .mat-tooltip .cdk- 
    global-overlay-wrapper {
    white-space: pre-line;
}

---

为此，我们需要覆盖.cdk overlay container.cdk global overlay wrapper的样式：

::ng-deep .cdk-overlay-container, .cdk-global-overlay-wrapper {
  white-space: pre-line;
}

在HTML中：

<p matTooltip="Multiline Tooltip &#13; This is second line">Hello World!</p>

<p #tooltip2="matTooltip" [matTooltip]="getTooltopScript()">Hello World!</p>

你好，世界

希望这能帮你解决问题。请参阅下面的工作示例：

---

要使其正常工作，我们需要覆盖.cdk overlay container.cdk global overlay wrapper的样式：

::ng-deep .cdk-overlay-container, .cdk-global-overlay-wrapper {
  white-space: pre-line;
}

在HTML中：

<p matTooltip="Multiline Tooltip &#13; This is second line">Hello World!</p>

<p #tooltip2="matTooltip" [matTooltip]="getTooltopScript()">Hello World!</p>

你好，世界

希望这能帮你解决问题。请参阅下面的工作示例：

---

如果文本来自ts文件，请找到以下解决方案：

在.ts文件中：

getTooltopScript(){
  return 'Multiline Tooltip \n This is second line';
}

在HTML中：

<p matTooltip="Multiline Tooltip &#13; This is second line">Hello World!</p>

<p #tooltip2="matTooltip" [matTooltip]="getTooltopScript()">Hello World!</p>

为了正确地查看工具提示，我们需要在全局样式表（即style.css）中添加材质样式导入：

在style.css中：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

请参阅下面的工作示例：

---

如果文本来自ts文件，请找到以下解决方案：

在.ts文件中：

getTooltopScript(){
  return 'Multiline Tooltip \n This is second line';
}

在HTML中：

<p matTooltip="Multiline Tooltip &#13; This is second line">Hello World!</p>

<p #tooltip2="matTooltip" [matTooltip]="getTooltopScript()">Hello World!</p>

为了正确地查看工具提示，我们需要在全局样式表（即style.css）中添加材质样式导入：

在style.css中：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

请参阅下面的工作示例：

---

谢谢，到目前为止还没有成功，我看到您在这里有了新类，[matTooltipClass]=“多行工具提示”。但是我在你的css课上看不到。应该在那里吗？我已经用很少的工作链接更新了我的解决方案。请看那些。[matTooltipClass]=“多行工具提示”我没有在我的示例中使用，因此它没有任何意义。谢谢，到目前为止没有成功，我看到您在这里有了新类，[matTooltipClass]=“多行工具提示”。但是我在你的css课上看不到。应该在那里吗？我已经用很少的工作链接更新了我的解决方案。请看那些。[matTooltipClass]=“多行工具提示”我没有在我的示例中使用，因此它没有任何意义。您可以尝试将

my tooltip

类作为CSS选择器中

mat tooltip

类的子类插入吗？@Edric:：：ng deep.mat tooltip.my tooltip.cdk overlay容器，：：ng deep.mat tooltip.my tooltip.cdk全局覆盖包装器{white space:pre line；}不起作用。能否尝试将

my tooltip

类作为CSS选择器中

mat tooltip

类的子类插入？@Edric:：ng deep.mat tooltip.my tooltip.cdk overlay容器，：：ng deep.mat tooltip.my tooltip.cdk全局覆盖包装器{white space:pre line；}不起作用。出于好奇，我怎么知道我应该将特定的css导入到我的样式中呢。出于好奇，我怎么知道应该将特定的css导入到我的样式中呢？