AngularJS: Insérer du HTML depuis une chaîne

J’ai beaucoup regardé pour ça, mais moi non plus je ne trouve pas la réponse ou je ne comprends pas. Un exemple spécifique gagnera le vote =)

  • J’ai une fonction qui renvoie une chaîne HTML.
  • Je ne peux pas changer la fonction.
  • Je veux que le html représenté par la chaîne soit inséré dans le DOM.
  • Je suis heureux d’utiliser un contrôleur, une directive, un service ou toute autre chose qui fonctionne (et qui est raisonnablement une bonne pratique).
  • Disclaimer: Je ne comprends pas bien comstackr.

Voici ce que j’ai essayé:

// My magic HTML ssortingng function. function htmlSsortingng (str) { return "

" + str + "

"; } function Ctrl ($scope, $comstack) { $scope.htmlSsortingng = htmlSsortingng; } Ctrl.$inject = ["$scope", "$comstack"];

Cela n’a pas marché.

Je l’ai essayé comme une directive aussi:

 // My magic HTML ssortingng function. function htmlSsortingng (str) { return "

" + str + "

"; } angular.module("myApp.directives", []) .directive("htmlSsortingng", function () { return { ressortingct: "E", scope: { content: "@" }, template: "{{ htmlStr(content) }}" } }); ... and in my HTML ...

Aidez-moi?

Remarque

Je les ai regardés, entre autres, mais je ne pouvais pas le faire fonctionner.

  • AngularJS: Insérer du HTML dans la vue
  • AngularJS $ http Analyseur HTML
  • angularjs – insertion de $ comstack-d html
  • AngularJS ne s’exécute pas en HTML inséré avec document.write ()
  • Échap du texte HTML dans une directive AngularJS

Regardez l’exemple dans ce lien:

http://docs.angularjs.org/api/ngSanitize.$sanitize

Fondamentalement, angular a une directive pour insérer du HTML dans les pages. Dans votre cas, vous pouvez insérer le code HTML en utilisant la directive ng-bind-html comme suit:

Si vous avez déjà fait tout cela:

 // My magic HTML ssortingng function. function htmlSsortingng (str) { return "

" + str + "

"; } function Ctrl ($scope) { var str = "HELLO!"; $scope.htmlSsortingng = htmlSsortingng(str); } Ctrl.$inject = ["$scope"];

Ensuite, dans votre fichier HTML dans le cadre de ce contrôleur, vous pouvez

 

vous pouvez aussi utiliser $sce.trustAsHtml('"

" + str + "

"') , si vous voulez en savoir plus, veuillez vous référer à $ sce