ng-bind-html-unsafe" wurde in Angular 1.2 entfernt
Ich versuche, etwas zu implementieren, wo ich ng-bind-html-unsafe
verwenden muss. In den Docs und auf dem Github-Commit heißt es:
ng-bind-html bietet ng-html-bind-unsafe wie Verhalten (innerHTML's das Ergebnis ohne Sanitization) wenn es an das Ergebnis von $sce.trustAsHtml(string) gebunden ist.
Wie kann man dies tun?
Filter
app.filter('unsafe', function($sce) { return $sce.trustAsHtml; });
Verwendung
<ANY ng-bind-html="value | unsafe"></ANY>
Das sollte so sein:
<div ng-bind-html="trustedHtml"></div>
plus in Ihrem Controller sein:
$scope.html = '<ul><li>render me please</li></ul>';
$scope.trustedHtml = $sce.trustAsHtml($scope.html);
statt der alten Syntax, bei der Sie die Variable "$scope.html" direkt referenzieren konnten:
<div ng-bind-html-unsafe="html"></div>
Wie mehrere Kommentatoren anmerkten, muss $sce
in den Controller injiziert werden, da sonst der Fehler $sce undefined
auftritt.
var myApp = angular.module('myApp',[]);
myApp.controller('MyController', ['$sce', function($sce) {
// ... [your code]
}]);
Persönlich bereinige ich alle meine Daten mit einigen PHP-Bibliotheken, bevor sie in die Datenbank gehen, so dass es keine Notwendigkeit für einen weiteren XSS-Filter für mich.
Von AngularJS 1.0.8
directives.directive('ngBindHtmlUnsafe', [function() {
return function(scope, element, attr) {
element.addClass('ng-binding').data('$binding', attr.ngBindHtmlUnsafe);
scope.$watch(attr.ngBindHtmlUnsafe, function ngBindHtmlUnsafeWatchAction(value) {
element.html(value || '');
});
}
}]);
Zu verwenden:
<div ng-bind-html-unsafe="group.description"></div>
Um $sce
zu deaktivieren:
app.config(['$sceProvider', function($sceProvider) {
$sceProvider.enabled(false);
}]);