Как использовать Pipe вместо HTML-разметки?

Question

Как использовать Pipe в функции замены с разметкой HTML в Angular?

Угловой HTML:

<ion-list class="item-autocom" *ngFor="let word of words">
    {{ word | replace }}
</ion-list>

Угловая труба TS:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'replace'
})
export class ReplacePipe implements PipeTransform {
  transform(value: any, args?: any): any {

    return value.replace('h', 'gi', '<b>$&</b>');

  }
}

Это вывод:

<b>$&</b> allo

Но мне нужно:

ч алло

Answer 1

Попробуйте заменить

{{ word | replace }}

на

<i [outerHTML]="word | replace"></i>

, чтобы ваш текст был проанализирован как HTML.