parse HTML innerhalb von ng-bind mit angularJS

Ich habe ein Problem mit angularJs. Meine Anwendung fordert einige Daten vom Server an und einer der Werte von den Daten, die vom Server zurückgegeben werden, ist eine Zeichenkette von HTML. Ich Bindung es in meinem Winkelvorlage wie dieseparse HTML innerhalb von ng-bind mit angularJS

<div>{{{item.location_icons}}</div>

aber wie man erwarten könnte, was ich sehe, ist nicht die Symbole Bilder aber das Markup im Grunde das Zeug in den div sieht aus wie

"<i class='my-icon-class'/>"

die ist nicht was ich will.

jemand weiß, was ich tun kann, die HTML im Einbindung

Quelle

2013-02-15 Edgar Martinez

Sie wollen analysieren ng-bind-html und ng-bind-html-unsafe für diese Art von Zweck verwenden.

Die Beispiele sind here

Quelle

2013-02-15 05:42:33 Tosh

Wie würde ich das mit ng-bind-html verwenden Ich sehe, wie ich ng-bind-unsafe-html nicht sicher verwenden kann, wenn unsichere ist eine Möglichkeit zu sagen, dass es ein schlechter Weg ist Sachen machen. Können Sie den ng-bind-html näher erläutern? Die eckigen Dokumente sind dazu nicht sehr klar. Ich habe es versucht und es hat nicht funktioniert –

Ehrlich gesagt, weiß ich nicht genau. Aber mein Verständnis ist, dass Sanitizer Tags mit beliebigen externen Referenzen wie 'href',' src' usw. entfernt. Wenn Sie Benutzereingaben binden, kann es unsicher sein, aber Sie sind an Ihren eigenen internen Wert gebunden Ich denke, es ist in Ordnung, un-sterilisierte Version zu verwenden. – Tosh

+10

'ng-bind-html' befindet sich im 'ngSanitize'-Modul, das wie' ngResource' nicht mit Angular vordefiniert ist. Sie müssen das Skript einschließen und sicherstellen, dass Ihre App davon abhängt: 'var app = angular.module ('app', ['ngSanitize']);'. Sie haben dann Zugriff auf die 'ng-bind-html'-Direktive, die Sie verwenden können:'

' – satchmorun

besser verwenden $compile ist anstelle von ng-bind-html-unsafe gezeigt.

See: http://docs.angularjs.org/api/ng.$compile

Schließlich ist im Moment, die letzte Version von AngularJS (Release Candidate 1.2.0) haben keine ng-bind-html-unsafe Richtlinie. Ich möchte Sie daher ermutigen, diese Option vor jeder zukünftigen Aktualisierung Ihrer App in Betracht zu ziehen. (ng-bind-html-unsafe kann/wird Arbeit nicht mehr ...)

http://code.angularjs.org/1.2.0rc1/docs/api/ng.directive:ngBindHtml

Quelle

2013-08-14 13:41:42

Meinst du nicht [$ sanitize] (http: //docs.angularjs.org/api/ngSanitize. $ sanitize) anstatt $ compile? –

Als ng-bind-html-unsichere veraltet ist, können Sie diesen Code verwenden Sie stattdessen.

Sie benötigen Funktion in Ihrem Controller erstellen:

$scope.toTrustedHTML = function(html){ 
    return $sce.trustAsHtml(html); 
}

und so etwas wie dies in der Ansicht verwenden:

<span ng-bind-html='toTrustedHTML(myHTMLstring)'></span>

Vergessen Sie nicht, $ sce zu injizieren:

AppObj.controller('MyController', function($scope, $sce) { 
    //your code here 
});

Quelle

2015-02-01 14:23:27

parse HTML innerhalb von ng-bind mit angularJS

Antwort

Verwandte Themen