AngularinnerHTML не работает с этим строковым текстом

Question

Я столкнулся с проблемой, я получаю строку

      const str = '<p>Please ensure Process Model diagram represents Functions adequately (boxes that represent an activity or group of activities that produce an outcome):</p><p><br></p><p><a href="https://www.google.com" rel="noopener noreferrer" target="_blank">Click here</a></p>'

      <div [innerHTML]="str"></div>

Я хочу удалить этот абзац и другие конструкции HTML, попробовал использоватьinnerHTMLно он не удаляет элементы HTML, не знаю почему. Как мы можем удалить элементы HTML и отобразить текст и ссылку?

Answer 1

Вы должны использоватьDomSanitizer.

      public str = this.sanitized.bypassSecurityTrustHtml('<p>Please ensure Process Model diagram represents Functions adequately (boxes that represent an activity or group of activities that produce an outcome):</p><p><br></p><p><a href="https://www.google.com" rel="noopener noreferrer" target="_blank">Click here</a></p>');

constructor(private sanitized: DomSanitizer) {}