javascript - 如何替换 Angular 2中的字符串？

Question

我在 html 页面中使用了以下插值。

<div>{{config.CompanyAddress.replace('\n','<br />')}}</div>

也用过

<div>{{config.CompanyAddress.toString().replace('\n','<br />')}}</div>

但两者都显示如下文字

{{config.CompanyAddress.replace('\n','<br />')}}
{{config.CompanyAddress.toString().replace('\n','<br />')}}

Answer 1

你也可以使用管道:

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({name: 'replaceLineBreaks'})
export class ReplaceLineBreaks implements PipeTransform {
  transform(value: string): string {
    return value.replace(/\n/g, '<br/>');
  }
}

管道必须包含在您的@NgModule 声明中才能包含在应用程序中。 要在您的模板中显示 HTML，您可以使用绑定(bind) outerHTML。

<span [outerHTML]="config.CompanyAddress | replaceLineBreaks"></span>