角度过滤器返回html

时间:2013-11-29 11:41:49

标签: javascript html angularjs

我想在 angularjs 1.2 中使用unsafe-html。没有html的过滤器确实有效,而html没有。我做了什么:

我在我的html头部添加了angular-sanitize:

<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-sanitize.js"></script>

我的角度模块:

var myApp = angular.module('myApp', ['ngSanitize'])
    .filter('convertState', function ($sce) {
        return function (state) {
            if (state == 1) {
                return $sce.trustAsHtml("<strong>" + state + "</strong> special state");
            }
            else {
                return $sce.trustAsHtml("<strong>"+state + "</strong> normal state");
            }
        }
    });

我的Html:

<td><span ng-bind-html="f.state | convertstate"></span></td>

修改:已将ng-bind-html-unsafe更新为ng-bind-html

2 个答案:

答案 0 :(得分:20)

ng-bind-html-unsafe已在Angular 1.2中删除。由于您正确地清理了输入,因此您应该使用ng-bind-html

示例:http://plnkr.co/edit/0bHeXrarRP7IAciqAYgM?p=preview

答案 1 :(得分:3)

您可以使用类似

的内容
app.directive('toHtml', function() {
  return {
    restrict: 'A',
    link: function (scope, el, attrs) {
      el.html(scope.$eval(attrs.toHtml));
    }
  };
});

用作:

<p to-html="name | convertState"></p>

http://plnkr.co/edit/Av2rmeXp7phkDdbYUbxF

相关问题