parse html all'interno di ng-bind usando angularJS

Ho riscontrato problemi con angularJs. La mia applicazione richiede alcuni dati dal server e uno dei valori dai dati restituiti dal server è una stringa di html. Sto legandola nel mio modello angolare come questoparse html all'interno di ng-bind usando angularJS

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

ma come ci si potrebbe aspettare quello che vedo non è le immagini di icone, ma il markup fondamentalmente la roba in div assomiglia

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

che non è quello che voglio

qualcuno sa che cosa posso fare per analizzare il codice HTML nella inclusione

fonte

2013-02-15 Edgar Martinez

Si desidera utilizzare ng-bind-html e ng-bind-html-unsafe per quel tipo di scopo.

Gli esempi sono mostrati here

fonte

2013-02-15 05:42:33 Tosh

come dovrei usare questo con ng-bind-html vedo come posso usare ng-bind-unsafe-html non sicuro se non sicuro è un modo di suggerire che è un cattivo modo di facendo cose. Puoi approfondire l'ng-bind-html? I documenti angolari non sono molto chiari su questo. Ho provato a usarlo e non ha funzionato –

Onestamente, non lo so esattamente. Ma la mia comprensione è che sanitizer rimuoverà i tag con qualsiasi riferimento esterno, come 'href',' src', ecc ... Se si sta vincolando l'input dell'utente, allora può essere pericoloso, ma si sta vincolando al proprio valore interno , Penso che sia OK usare la versione non disinfettata. – Tosh

+10

'ng-bind-html' è nel modulo' ngSanitize', che, come 'ngResource' non è preconfezionato con Angular. Dovrai includere lo script e assicurarti che la tua app dipenda da esso: 'var app = angular.module ('app', ['ngSanitize']);'. Avrai quindi accesso alla direttiva 'ng-bind-html', che puoi usare come:'

' – satchmorun

Un modo migliore è usare $compile anziché ng-bind-html-unsafe.

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

Infine, al momento, l'ultima versione di angularJS (Release Candidate 1.2.0) non hanno alcuna direttiva ng-bind-html-unsafe. Quindi ti incoraggio davvero a considerare questa opzione prima di qualsiasi aggiornamento futuro della tua app. (ng-bind-html-unsafe può/non si lavora più ...)

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

fonte

2013-08-14 13:41:42

Non intendi [$ sanitize] (http: //docs.angularjs.org/api/ngSanitize. $ sanitize) piuttosto che $ compilare? –

Come ng-bind-html-non sicuro è deprecato, è possibile utilizzare questo codice invece.

È necessario creare la funzione all'interno del controllore:

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

e usare qualcosa di simile a suo avviso:

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

Non dimenticate di iniettare $ SCE:

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

fonte

2015-02-01 14:23:27

parse html all'interno di ng-bind usando angularJS

risposta

Problemi correlati