AngularJS：插入HTML从字符串 [英] AngularJS: Insert HTML from a string

问题描述

我已经看了很多关于这一点，但我不是，我找不到答案，或者我不明白。一个具体的例子将赢得选票=）

I've looked a LOT for this, but I either I can't find the answer or I don't understand it. A specific example will win the vote =)

• 我有一个返回HTML字符串的函数。


• 我不能改变的功能。


• 我想通过字符串psented的HTML重新$ P $插入到DOM。


• 我很高兴能使用控制器，指导，服务，或其他任何工作（和合理好的做法）。


• 免责声明：我不明白$编译以及

下面是我已经试过：

// My magic HTML string function.
function htmlString (str) {
    return "<h1>" + str + "</h1>";
}

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

这没有奏效。

我试了一下作为指令太：

I tried it as a directive too:

// My magic HTML string function.
function htmlString (str) {
    return "<h1>" + str + "</h1>";
}

angular.module("myApp.directives", [])
  .directive("htmlString", function () {
    return {
      restrict: "E",
      scope: { content: "@" },
      template: "{{ htmlStr(content) }}"
    }
  });

  ... and in my HTML ...

  <html-string content="foo"></html-string>

帮助？

的注意的

我看着这些，等等，但不能使它工作。

I looked at these, among others, but couldn't make it work.

• html插入使用AngularJS视图


• AngularJS $ HTTP HTML解析器


• angularjs - 插入$编译-D的HTML


• AngularJS不执行HTML插入的document.write（）


• Escape在AngularJS指令
HTML文本

• Insert HTML into view using AngularJS
• AngularJS $http HTML Parser
• angularjs - inserting $compile-d html
• AngularJS doesn't execute in HTML inserted with document.write()
• Escape HTML text in an AngularJS directive

推荐答案

在这个链接，看看这个例子：

Have a look at the example in this link :

<一个href=\"http://docs.angularjs.org/api/ngSanitize.$sanitize\">http://docs.angularjs.org/api/ngSanitize.$sanitize

基本上，角具有一个指令，html插入页面。你的情况，你可以使用插入HTML中的NG-绑定HTML的指令，像这样：

Basically, angular has a directive to insert html into pages. In your case you can insert the html using the ng-bind-html directive like so :

如果你已经做了这一切：

If you already have done all this :

// My magic HTML string function.
function htmlString (str) {
    return "<h1>" + str + "</h1>";
}

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

然后在控制范围之内你的HTML，你可以

Then in your html within the scope of that controller, you could

<div ng-bind-html="htmlString"></div>

这篇关于AngularJS：插入HTML从字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！