htmlを生成する角度フィルター

Question

私は本当の値の代わりに（ブートストラップ）アイコンを挿入する小さい角度のフィルターを持っています。 それは動作しますが、HTMLがエンコードされている：

var conApp = angular.module('conApp', []); 
    conApp.filter('trueIcon', function($filter){ 
    return function(booleanValue){ 
     return booleanValue ? '<i class="icon-ok"></i>' : ''; 
    } 
    }); 

は、私は、HTMLをデコードするために別のフィルタを実装する必要がありますか？ これを行う「角度のある」方法がありますか？

Answer 1

htmlを表示するには、ng-bind-htmlを使用する必要があります。

<span ng-bind-html="foo | trueIcon"></span> 

これは本当にフィルターの対象ではありません。フィルタは、ビュー/ DOM自体の要素を生成するのではなく、ビューに書き込まれるデータをスクラブするためのものです。

app.directive('trueIcon', function() { 
    return { 
     restrict: 'E', 
     template: '<i ng-class="{\'icon-ok\': value, \'icon-not-okay\': !value}"></i>', 
     scope: { 
     value: '=' 
     } 
    }; 
}); 

<true-icon value="foo"></true-icon> 

Answer 2

AngularJSはデフォルトで式評価の結果を消毒しています。

• http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml（ngSanitizeモジュールから）
• http://docs.angularjs.org/api/ng.directive:ngBindHtmlUnsafe（それが潜在的なセキュリティリスクを開くように私はこの1つをお勧めしません）：マークアップとしてHTMLを表示するには、2つのオプションを持っています。

上記はフィルタを動作させますが、それをディレクティブにすることを検討する必要がありますか？