Q:

How to truncate text in Angular?

I want to show smaller text. I see options like making custom pipe for truncating string but my case is different as follows.
<p [innerHTML]="aboutUs"></p>

In this I can't use a custom pipe. I'm doing this because I show text from backend & it comes with tags that's why [innerHtml] is used. Please help.

A:

You can do with a custom function using TypeScript as,
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;
}

and in the HTML refer it as,
<div [innerHTML]="truncateChar(aboutUs)"></div>

