La valeur sûre doit utiliser [Propriété] = reliure après pontage de sécurité en utilisant DomSanitizer

HTML CODE
<p #mass_timings=""></p>



//Controller code

@ViewChild/'mass_timings'/ mass_timings: ElementRef;
constructor/private domSanitizer:DomSanitizer/
getInnerHTMLValue//{
this.mass_timings.nativeElement.innerHTML =
this.domSanitizer.bypassSecurityTrustHtml/this.parishDetail.mass_timings/;

}


Mais la sortie qui affiche mass_timings, Inclure le texte: -

La valeur sûre devrait utiliser [Propriété] = reliure

au début

Comment supprimer cette chaîne.
Invité:

Blanche

Confirmation de:

Comme indiqué dans le message d'erreur, purifié HTML Doit être ajouté par des propriétés de liaison:


<p [innerhtml]="massTimingsHtml"></p>



constructor/private domSanitizer:DomSanitizer/ {
this.massTimingsHtml = this.getInnerHTMLValue//;
}
getInnerHTMLValue//{
return this.domSanitizer.bypassSecurityTrustHtml/this.parishDetail.mass_timings/;
}


https://stackblitz.com/edit/angular-bmxbmy
/basé sur Plunker Swapnil Pièce - Voir les commentaires ci-dessous/

Alice

Confirmation de:

Vous avez besoin sanitize// safevalue comme ça :


this.domSanitizer.sanitize/SecurityContext.HTML,this.domSanitizer.bypassSecurityTrustHtml/this.parishDetail.mass_timings//;

Catherine

Confirmation de:

J'ai eu cette erreur lorsque vous utilisez iframe, Donc, là je l'ai corrigé avec
[src]

, Comme indiqué ci-dessous:

Importer ceci

:


import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
constructor/private sanitizer: DomSanitizer, ....other DI/{}


Dans le fichier ts


getSafeUrl// {
return this.sanitizer.bypassSecurityTrustResourceUrl/this.url/;
}


Dans le fichier

html


<iframe *ngif="url" [src]="getSafeUrl//" frameborder="0"></iframe>


Cette méthode prend beaucoup de temps, car elle provoquera une fonction plusieurs fois, il est donc préférable de désinfecter URL à l'intérieur lifeCycleHooks, comme
ngOnInit//

.

Vous pouvez également utiliser des tuyaux pour améliorer les performances:


<div [innerhtml]="htmlValue | byPassSecurity"></div>


import { Pipe, PipeTransform, SecurityContext } from "@angular/core";
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Pipe/{
name: 'byPassSecurity'
}/
export class ByPassSecurityPipe implements PipeTransform {

constructor/private sanitizer: DomSanitizer/ {}

transform /value: string/: SafeHtml {
return this.sanitizer.bypassSecurityTrustHtml/value/;
}
}

Agathe

Confirmation de:

J'ai eu la même erreur lorsqu'il est utilisé MATHJAX dans angular 7. J'ai résolu le problème avec la transformation suivante du tuyau. 100% Parfaitement en cours d'exécution

//Sanitize HTML trompette


import { Pipe, PipeTransform, SecurityContext } from "@angular/core";
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Pipe/{
name: 'sanitizeHtml'
}/
export class SanitizeHtmlPipe implements PipeTransform {

constructor/private _sanitizer: DomSanitizer/ {
}

transform/value: string/: SafeHtml {
return this._sanitizer.sanitize/SecurityContext.HTML, this._sanitizer.bypassSecurityTrustHtml/value//
}
}

Alice

Confirmation de:

Ma solution à l'aide du tuyau.

HTML


<div [innerhtml]="htmlValue | byPassSecurity"></div>


Trompette


import { Pipe, PipeTransform, SecurityContext } from "@angular/core";
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Pipe/{
name: 'byPassSecurity'
}/
export class ByPassSecurityPipe implements PipeTransform {

constructor/private sanitizer: DomSanitizer/ {}

transform /value: string/: SafeHtml {
return this.sanitizer.bypassSecurityTrustHtml/value/;
}
}

Pour répondre aux questions, connectez-vous ou registre