相关疑难解决方法(0)

编辑:澄清任何只撇去标题的人,我的问题是关于Angular 2,而不是1.

我有一个组件模板,如下所示:

<div>{{ post.body }}</div>

对象是这样的:

{
    "title": "Some Title",
    "body": "<p>The <em>post body</em>.</p>"
}

而不是像下面那样渲染段落:

该帖子体

它显示:

"<p>The <em>post body</em>.</p>"

由于它是如此常见的任务,我寻找一个内置的管道,{{ post.body | safe }}但没有看到一个.

是否有一种简单的方法可以实现这一目标？是否有一种安全的方法来实现这一目标？

我看了很多,但我要么找不到答案,要么我不明白.一个具体的例子将赢得投票=)

• 我有一个返回HTML字符串的函数.
• 我不能改变这个功能.
• 我希望将字符串表示的html插入到DOM中.
• 我很高兴使用控制器,指令,服务或其他任何有效的方法(并且是相当不错的做法).
• 免责声明:我不理解$编译好.

这是我尝试过的:

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

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

那没用.

我也试过它作为一个指令:

// 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 …

我有包含HTML的JSON变量.

通过做:{{source.HTML}}Angular显示<,>而不是<和>.

如何让Angular呈现实际的HTML？

更新:
这是我的控制器:

app.controller('objectCtrl', ['$scope', '$http', '$routeParams',
  function($scope, $http, $routeParams) {

    var productId = ($routeParams.productId || "");

    $http.get(templateSource+'/object?i='+productId)
       .then(function(result) {
          $scope.elsevierObject = {};
          angular.extend($scope,result.data[0]);
        });
  }]);

在我的HTML中,我可以使用:

<div>{{foo.bar.theHTML}}</div>