无法在angularjs中正确呈现转义的html

时间:2015-09-16 17:35:13

标签: html angularjs escaping

我有以下数据

  var $scope.testtext  ="<b>Conducting</b>";
  $scope.getSafeHtml = function(x)
  {

     return $sce.trustAsHtml(x);
  };
  <div ng-bind-html="getSafeHtml(testtext)" ></div>

我希望输出像

导电

但是,无论我做什么,我总是得到如下的输出

<b>Conducting</b>

以下是我的尝试。

  <div ng-bind-html="getSafeHtml(testtext)" ></div>
  <div ng-bind-html="testtext" ></div>

我在我的应用中添加了ngSanitize。即使这样也行不通。所以我想知道我做错了什么?

只有对我有用的东西是

  var $scope.testtext  ="&lt;b&gt;Conducting&lt;/b&gt;";
  $scope.getSafeHtml = function(x)
  {
     var decoded = angular.element('<p>').html(x).text();
     return $sce.trustAsHtml(decoded);
  };

但我不想使用最后一个解决方案,因为我知道第一个代码有些小问题。

这是相同的插件。

plnkr.co/edit/OG13qEb14PTXZj3rqiDM?p=preview

1 个答案:

答案 0 :(得分:0)

如何创建指令来做到这一点?

var app = angular.module('app', []);

app.directive('dynamic', function ($compile) {
  return {
    restrict: 'A',
    replace: true,
    link: function (scope, ele, attrs) {
      scope.$watch(attrs.dynamic, function(html) {
        ele.html(html);
        $compile(ele.contents())(scope);
      });
    }
  };
});

此主题可能有助于Compiling dynamic HTML strings from database