angular中的$sanitize服务.

此服务依赖于ngSanitize模块.(这个模块需要加载angular-sanitize.js插件)

要学习这个服务,先要了解另一个指令: ng-bing-html.

顾名思义,ng-bind-html和ng-bind的区别就是,ng-bind把值作为字符串,和元素的内容进行绑定,但是ng-bind-html把值作为html,和元素的html进行绑定.相当于jq里面的.text()和.html().

但是,出于安全考虑,如果我们直接使用ng-bind-html是会报错的,ng-bind-html后面的内容必须经过一定的处理.

处理的方式有两种,一种是使用$sce服务,另一种就是使用$sanitize服务.$sce服务怎么用,在以后的文章中会独立讲解,这篇主要讲解$sanitize服务.

$sanitize会根绝一个白名单来净化html标签.这样,不安全的内容就不会被返回. 白名单是根据$compileProvider的aHrefSanitizationWhitelist和imgSrcSanitizationWhitelist函数得到的.

比如

var app =angular.module(‘myApp‘,[‘ngSanitize‘]);
app.controller(‘ctrl‘,function($scope,$sce){
$scope.myHtml = ‘<p style="color:blue">an html\n‘ +
‘<em onclick="this.textContent=\‘code_bunny\‘">click here</em>\n‘ +
‘snippet</p>‘;
$scope.trustHtml = $sce.trustAsHtml($scope.myHtml)
});

angularjs ng-bind-html的用法总结的更多相关文章

  1. MyBatis从入门到精通(第4章):MyBatis动态SQL【foreach、bind、OGNL用法】

    (第4章):MyBatis动态SQL[foreach.bind.OGNL用法] 4.4 foreach 用法 SQL 语句中有时会使用 IN 关键字,例如 id in (1,2,3).可以使用 ${i ...

  2. js中.bind()和.call()用法讲解

    var option = { ti : 8, it(){ return this.ti; } } 这里又一个option对象,it()方法里的this指的就是option对象的上下文. console ...

  3. 一个简单的例子让你很轻松地明白JavaScript中apply、call、bind三者的用法及区别

    JavaScript中apply.call.bind三者的用法及区别 引言 正文 一.apply.call.bind的共同用法 二. apply 三. call 四. bind 五.其他应用场景 六. ...

  4. AngularJs angular.bind、angular.bootstrap、angular.copy

    angular.bind 返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能. 格式:angular.bind(se ...

  5. 夺命雷公狗—angularjs—22—bind改指向和传参方式

    在angularjs中的传参的jquery的方式是极度相似的噢,而且还可以通过bind来改变指向 <!DOCTYPE html> <html lang="en" ...

  6. 详解AngularJS中的filter过滤器用法

    系统的学习了一下angularjs,发现angularjs的有些思想根php的模块smarty很像,例如数据绑定,filter.如果对smarty比较熟悉的话,学习angularjs会比较容易一点.这 ...

  7. apply、call、bind区别、用法

    apply和call都是为了改变某个函数运行时的上下文而存在的(就是为了改变函数内部this的指向):   如果使用apply或call方法,那么this指向他们的第一个参数,apply的第二个参数是 ...

  8. MyBatis bind标签的用法

    From<MyBatis从入门到精通> <!-- 4.5 bind用法 bind标签可以使用OGNL表达式创建一个变量并将其绑定到上下文中. 需求: concat函数连接字符串,在M ...

  9. js中call,apply,bind方法的用法

    call .apply.和bind 以上这三个方法都是js function函数当中自带的方法,用来改变当前函数this的指向. call()方法 语法格式: fun.call(thisArg[,ar ...

  10. C++11 bind和function用法

    function是一个template,定义于头文件functional中.通过function<int(int, int)> 声明一个function类型,它是“接受两个int参数.返回 ...

随机推荐

  1. Django请求生命周期

    生命周期: 指浏览器访问开始,经过Django都发生了什么 ? 1 首先客服端发送http请求,把请求体(请求头和请求内容)生成 2 服务器接收请求后,根据路由映射表一个一个匹配.匹配成功后,后面不匹 ...

  2. sql中的不常见查询

    1.对于CROSS APPLY 和 OUTER APPLY 的应用: CROSS APPLY 类似于INNER JOIN 但是,可以规定对于满足条件的数据需要关联几行,应用场景: 每个零件把第一个工单 ...

  3. SUSE11sp3 perf工具安装过程

    工作环境是suse11sp3系统(内核版本3.0.101-0.47.90-default),需要通过perf排查系统性能问题,但是默认是没有perf工具的. 在网上搜索了一下,需要linux-tool ...

  4. CDH 安装 kafka

    前言 其实cloudera已经做了这个事了,只是把kafka的包和cdh的parcel包分离了,只要我们把分离开的kafka的服务描述jar包和服务parcel包下载了,就可以实现完美集成了. 具体实 ...

  5. LocalDate的使用

    LocalDate的一些使用方法 今天半天的时间都用在了LocalDate上,然后呢,也是自己的第一次写博客. 首先来看看会用上的方法吧. 两个构造器,用的是静态工厂方法 static   Local ...

  6. Java框架spring 学习笔记(九):Spring的bean管理(@Required、@Component、@Autowired、@Resource注解)

    注解:代码里面特殊的标记,使用注解可以完成相关功能 注解写法:@注解名称(属性名.属性值) @Required 用在set方法上,一旦用了这个注解,那么容器在初始化bean的时候必须要进行set,也就 ...

  7. java 下载网络文件

    1.FileUtils.copyURLToFile实现: import java.io.File; import java.net.URL; import org.apache.commons.io. ...

  8. 100-days: twenty-four

    Title: No word of a lie: scientists rate(评出) the world's biggest peddlers of bull(说瞎话的人,扯淡的人) bullsh ...

  9. jquery 中dataTable显示加载中,图片或文字

    引入js文件 <script type="text/javascript" src="${basePath}/lib/datatables/1.10.0/jquer ...

  10. mysql权限操作(转)

    慢慢看吧mysql中可以给你一个用户授予如select,insert,update,delete等其中的一个或者多个权限,主要使用grant命令,用法格式为: grant 权限 on 数据库对象 to ...