如何在AngularJS中的字符串插值内获得换行符

Question

因此，我尝试做一些非常简单的事情，但遇到了麻烦。我有一个String变量，在该变量中，我想设置换行符，以便文本的某些部分转到新行。

我尝试过的

title: string = "My \n Title";
title: string = "My\ Title";
title: string = "My\
Title";
title: string = "My" + "\n" + "Title";

我尝试了许多变体，但无法正常工作。我是不是很傻并且缺少一些显而易见的东西？

不是重复的，因为我尝试过，<br/>并且没有用。

更新：

像这样在浏览器HTML中打印变量 {{title}}

Answer 1

在html中添加样式：

<div style="white-space: pre-line">{{DialogText}} </div>

使用 '\n' 在打字稿中添加换行符。

this.DialogText = "Hello" + '\n' + "World";

在stackblitz中相同：https ://stackblitz.com/edit/angular-rpoxr5linebreak

Answer 2

这是两个可以正常工作的版本...

空白空间

解决方案一...如果希望换行符在HTML中得到尊重...（可使用反引号字符串或'My \ntitle'...

document.getElementById('example').innerHTML = `My
title`;

h1 {
  white-space: pre;
}

<h1 id="example">

</h1>

角版本：

<h1 style="white-space: pre;">{{title}}</h1>

HTML中断

解决方案二...您要使用HTML ...

<h1 style="white-space: pre;">{{title}}</h1>

document.getElementById('example').innerHTML = 'My<br />title';

如果要在绑定期间允许HTML，请使用ng-bind-html 。