$ sce.trustAsHtml gegen ng-bind-html

Question

Warum kann ich dies tun:

<div>{{data | htmlfilterexample}}</div> 

Wenn im Inneren des Filters, ich bin wieder:

return $sce.trustAsHtml(input); 

<div ng-bind-html="data | htmlfilterexample"></div> Werke verwenden, unabhängig wenn der Filter input oder $sce.trustAsHtml(input) zurückgibt.

Ich hatte den Eindruck, dass $sce HTML-Trustworth macht und ng-bind-html nicht für die von dieser Methode zurückgegebene Ausgabe benötigt wird.

Danke.

Answer 1

$sce.trustAsHtml() erzeugt eine Zeichenfolge, die mit ng-bind-html sicher verwendet werden kann. Wenn Sie diese Funktion nicht in der Zeichenfolge verwenden würden, würde ng-bind-html den Fehler ergeben: [$sce:unsafe] Attempting to use an unsafe value in a safe context.] So $ sce wird nicht die Notwendigkeit für ng-bind-html loswerden, sondern macht die Zeichenfolge, die es verarbeitet, damit sicher zu verwenden. zwischen ng-bind und ng-bind-html

Mit {{}} in liegt in der Differenz ausgeführt ist das Äquivalent von ng-bind

Das spezifische Problem Sie. Also, im ng-bind Quellcode suchen (ng-bind-* source code) sehen wir, dass es diese verwendet:

element.text(value == undefined ? '' : value); 

während ng-bind-html, unter anderem ist die folgende:

var parsed = $parse(attr.ngBindHtml); 
element.html($sce.getTrustedHtml(parsed(scope)) || ''); 

Der Schlüssel zum Mitnehmen ist, dass die ng-bind Verwendung von .text (http://api.jquery.com/text/) führt zur Textdarstellung der angezeigten Zeichenfolge (ignoriert, ob HTML vertrauenswürdig ist).

Während die ng-bind-html Verwendung von .html (http://api.jquery.com/html/) Ergebnissen in der HTML-Version interpretiert (falls von getTrustedHtml() sicher erklärt)