angular 2 材质 matTooltip 多线 [英] angular 2 material matTooltip multiline

问题描述

我是 Angular 2 Material 的新手.使工具提示多行的首选方法是什么?

I'm new to Angular 2 Material. What's the preferred way to make a tool tip multi-line?

例如，我可能有以下工具提示:

For example, I might have the following tool tip:

AA BBBBBBBBBB CCCC DDDDD

而且，我可能想让它以这样的多行格式显示:

And, I may want to to have it display in a multi-line format like this:

AA BBBBBBBBBB 
CCCC 
DDDDD

推荐答案

首先，为您的工具提示创建一个类，使其在换行时换行.

First, create a class for your tooltip, to make it break lines on line breaks.

.my-tooltip {
    white-space: pre-line;
}

然后，将该类添加到您的工具提示并插入带有 Unicode 代码的换行符 


Then, add the class to your tooltip and insert line breaks with the Unicode code 


<span 
    matTooltip="First line&#13;Second line"
    matTooltipClass="my-tooltip">
</span>

这篇关于angular 2 材质 matTooltip 多线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！