Question

我有api whit /n代码，可以用<br>代码替换角度6

这是我的代码：

{{x.deskripsi}}

我尝试使用https://www.npmjs.com/package/angular-nl2br-filter

但我不知道如何使用{{}}标记内的绑定

我尝试使用此代码

<p ng-bind-html="x.deskripsi | nl2br"></p>

但不起作用

任何帮助？

之前感谢

Answer 1

您不需要图书馆。只需将代码的white-space属性设置为pre-wrap（或使用默认情况下应具有此样式的<pre>标记）

document.querySelector('#formatted').innerText = 'Lorem\nIpsum';

#formatted {
  white-space: pre-wrap;
}

<div id="formatted"></div>
<div>Lorem\nIpsum</div>

Answer 2

您可以使用相同的管道：

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，您可以使用绑定innerHTML。

<p [innerHTML]="x.deskripsi | replaceLineBreaks"></p>

Answer 3

你可以使用它：

<td [innerHTML]="kalaItem.PlanNetworkSimZaminiName | safeHtml"></td>

safeHtml 管道=>

import { Pipe } from '@angular/core'; 
import { DomSanitizer } from '@angular/platform-browser';
@Pipe({ name: 'safeHtml' })
export class SafeHtmlPipe {
    constructor(private sanitizer: DomSanitizer) {}

    transform(value: any, args?: any): any {
        return this.sanitizer.bypassSecurityTrustHtml(value);
    }
}

用\ n标记角度6替换\ n

3 个答案: