в angular2 ввод html

#javascript #html #angular

#angular #angular2-безопасность

Вопрос:

<div [innerHTML]="html"></div> не работает, когда html содержит Iframe. Я пытался выполнить некоторый обход безопасности this.sanitizer.bypassSecurityTrustResourceUrl(... , но он все еще не работает.

Вот демонстрация с неправильным вводом angular2.

Ответ №1:

Рабочий ПЛУНЖЕР

bypassSecurityTrustHtml Для этого вам нужно использовать, и вам нужно назначить и использовать очищенный html таким образом

 this.html = this.sanitizer.bypassSecurityTrustHtml(this.html);
 

Комментарии:

1. После стабильной версии angular import { DomSanitizationService } из ‘@angular/platform-browser’; Следует импортировать { DomSanitizer } из ‘@angular/platform-browser’; И также изменить внедрение в конструкторе.

2. Я добавил URL-адрес видео в iframe, отрисовал нормально, но не работает при воспроизведении, по какой-либо причине?

Ответ №2:

DomSanitizationService устарел с angular2 RC6

Если вы используете angular2 RC5, используйте это-

 DomSanitizationService
 

Если вы переходите на angular2 RC6, используйте это-

 DomSanitize
 

Вот полный пример

 import {DomSanitizer} from '@angular/platform-browser';
 

Затем добавьте в конструкцию

 private sanitizer: DomSanitizer
 

и примените дезинфицирующее средство к вашей переменной следующим образом

 let text = <iframe width="977" height="733" src="https://www.youtube.com/embed/C0DPdy98e4c" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
text = this.sanitizer.bypassSecurityTrustHtml(text);
return text;
 

Ответ №3:

Innerhtml Angular 8

this.sanitizer.bypassSecurityTrustHtml() принимает строку в качестве входных данных и делает ее SafeHtml.Я сделал это в Angular 8.