如何在angularjs中使用ng-bind-html解析自定义html元素

Question

我需要使用 ng-bind-html 解析一个字符串。此字符串中包含一些自定义 html 标记。在使用 ng-bind-html 进行解析时，会出现 $sanitize:badparse 的错误。

请查看小提琴中的错误：http://jsfiddle.net/8zS4h/2/

在 stackoverflow 和 google 中阅读问题时，我发现如果我使用 $sce.trustAsHtml() 可能会有解决方案。

这解决了我的错误问题，但无法解析我的自定义 html 元素。 你可以在这里看到这个更新的小提琴：http://jsfiddle.net/8zS4h/3/

我正在努力寻找解决方案。

编辑： 只是为了添加更多信息，我从 rss 提要中获取这个字符串，所以有时它也可以有 "<http>" 或 "<http" 标签。这是失败的地方。 所以如果字符串像<http://www.<em>whitehouse</em>.gov/omb/circulars/a076/ 应该给出像http://www.<em>whitehouse</em>.gov/omb/circulars/a076/ 这样的输出

Answer 1

好吧，我成功地获得了像锚、下划线和粗体这样的工作标签，没有问题，看：

Fiddle

angular.module('ngBindHtmlExample', ['ngSanitize'])
  .controller('ngBindHtmlCtrl', ['$scope', function ngBindHtmlCtrl($scope) {
    $scope.myHTML =
        '<a href=\"http://google.com\">link</a> contests <u>of OMB</u> <b>Circular</b> A-76';
  }])
    .filter('to_trusted', ['$sce', function($sce){
        return function(text) {
            return $sce.trustAsHtml(text);
        }; 
}]);

好像解析正确