Почему Angular innerHTML не выводит код во фрейме и не все элементы разметки?

Question

Я поставил такой код, где значение содержит текст целой страницы с фреймами, видео, фото, текстом. Выводится только текст со стилями, а ссылки на ютуб во фрейме и "слетели" куда-то.

 <div [innerHTML]="store.selectedPost['content']['rendered']"></div>

Это как-то связано с безопасностью? Как сделать, что б всё отображалось, "как есть в коде" ?

Answer 1

Как я могу предположить ангулар вырезает потенциально небезопасный код, для того чтобы отобразить данные их нужно сначала санитизировать, я предлагаю делать это через pipe, код пайпа:

@Pipe({ name: 'safeHtml' })
export class SafeHtmlPipe implements PipeTransform {
  constructor(private dom: DomSanitizer) {}

  public transform(value: string): string{
    return this.dom.bypassSecurityTrustHtml(value);
  }
}

И уже в коде использовать таким образом:

 <div [innerHTML]="store.selectedPost['content']['rendered'] | safeHtml"></div>

БЛОГ НА HUSL

Почему Angular innerHTML не выводит код во фрейме и не все элементы разметки?

Ответы (1 шт):