angular - 如何截断Angular中的文本？

Question

我想显示较小的文本。我看到了诸如为截断字符串制作自定义管道之类的选项，但我的情况有所不同，如下所示。

<p [innerHTML]="aboutUs"></p>

在此我不能使用自定义管道。我这样做是因为我显示来自后端的文本并且它带有标签，这就是使用 [innerHtml] 的原因。请帮忙。

Answer 1

您可以使用 TypeScript 来处理自定义函数，

truncateChar(text: string): string {
    let charlimit = 100;
    if(!text || text.length <= charlimit )
    {
        return text;
    }

  let without_html = text.replace(/<(?:.|\n)*?>/gm, '');
  let shortened = without_html.substring(0, charlimit) + "...";
  return shortened;
}

在 HTML 中将其称为，

<div [innerHTML]="truncateChar(aboutUs)"></div>