如何在 Typescript - Angular 8 中的字符串中添加新行

Question

我正在尝试在打字稿中实现以下内容：

this.comments = this.comment1 + '/n' + this.comment2

在 HTML 中，它被绑定为{{comments}} 。

它应该打印：

comment1
comment2

但它打印：

comment1/ncomment2

我也试过<br\\>但它不起作用。 怎么做？

Answer 1

为此，您可以在任何模板元素中使用innerHTML和innerText指令。 喜欢：

TS

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Hello<br>World';
  weather = 'Super\nsunny\nday';
}

HTML

<div [innerHTML]="name"></div>
<div [innerText]="weather"></div>

演示供您参考： https : //stackblitz.com/edit/angular-chusrl

Answer 2

您需要使用“\\n”而不是“/n”

Answer 3

您可以使用 es6 功能模板字符串尝试此操作：-

this.comments = `${this.comment1}
${this.comment2}`;

当您使用 typescript 时，您应该使用 es6 特性来利用代码中的更多功能。