AngularJS $sce-清理并渲染模板中的内容和资源


本文向大家介绍AngularJS $sce-清理并渲染模板中的内容和资源,包括了AngularJS $sce-清理并渲染模板中的内容和资源的使用技巧和注意事项,需要的朋友参考一下

示例

$sce(“严格上下文转义”)是一种内置的角度服务,可自动清除模板中的内容和内部源。

外部源和原始HTML  注入模板需要手动包装$sce。

在此示例中,我们将创建一个简单的$sce卫生过滤器: `。

演示版

.filter('sanitizer', ['$sce', [function($sce) {
     return function(content) {
          return $sce.trustAsResourceUrl(content);
      };
}]);

模板中的用法

<div ng-repeat="item in items">
    
    // 消毒外部来源
    <ifrmae ng-src="{{item.youtube_url | sanitizer}}">
    
    // 清理并渲染HTML 
    <div ng-bind-html="{{item.raw_html_content| sanitizer}}"></div>

</div>