angularJS1笔记-(17)-ng-bind-html指令
angular不推荐大家在绑定数据的时候绑定html,但是如果你非要这么干也并不是不可以的。举个例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>指令</title> </head>
<body ng-app ng-init="username='<h1>shit</h1>'">
<!--ng-bind指令在绑定的值包含html时会转义,为了安全(跨站脚本攻击)-->
<strong ng-bind-html="username"></strong> <script src="app/bower_components/angular/angular.js"></script> </body>
</html>
写这样的一段代码在浏览器运行：
会看到错误信息：
看意思是在一个安全的环境中使用了不安全的值导致的，这个时候我们需要引入angular的一个依赖包 angular-sanitize：
引入完成后我们导入项目,然后在模块中写明依赖:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>指令</title> </head>
<body ng-app="myApp" ng-init="username='<h1>shit</h1>'">
<!--ng-bind指令在绑定的值包含html时会转义,为了安全(跨站脚本攻击)-->
<strong ng-bind-html="username"></strong> <script src="app/bower_components/angular/angular.js"></script>
<script src="app/bower_components/angular-sanitize/angular-sanitize.js"></script>
<script>
//使用自定义的模块才可以依赖别的包里面定义模块 angular定义的默认模块没有任何依赖
angular.module('myApp', ['ngSanitize'])
</script>
</body>
</html>
此时运行就可以看到正确结果ngSanitize的作用是让html不转义:
angularJS1笔记-(17)-ng-bind-html指令的更多相关文章
- ng之自定义指令
最近开始研究并使用angular,今天就来简单讲讲对于ng中自定义指令的一下使用心得吧! 相信用过ng的人都对ng中的指令有所了解,指令,我将其理解为AngularJS操作HTML element的一 ...
- 《Linux就该这么学》培训笔记_ch13_使用Bind提供域名解析服务
<Linux就该这么学>培训笔记_ch13_使用Bind提供域名解析服务 文章最后会post上书本的笔记照片. 文章主要内容: DNS域名解析服务 安装并部署Bind服务程序 部署从服务器 ...
- Ext.Net学习笔记17：Ext.Net GridPanel Selection
Ext.Net学习笔记17:Ext.Net GridPanel Selection 接下来是Ext.Net的GridPanel的另外一个功能:选择. 我们在GridPanel最开始的用法中已经见识过如 ...
- 【精选】Nginx模块Lua-Nginx-Module学习笔记（二）Lua指令详解(Directives)
源码地址:https://github.com/Tinywan/Lua-Nginx-Redis Nginx与Lua编写脚本的基本构建块是指令. 指令用于指定何时运行用户Lua代码以及如何使用结果. 下 ...
- SQL反模式学习笔记17 全文搜索
目标:全文搜索 使用SQL搜索关键字,同时保证快速和精确,依旧是相当地困难. SQL的一个基本原理(以及SQL所继承的关系原理)就是一列中的单个数据是原子性的. 反模式:模式匹配 使用Like 或者正 ...
- JAVA自学笔记17
JAVA自学笔记17 1.Map接口 1)概述 将键映射到值的对象,一个映射不能包含重复的键,每个键最多只能映射到一个值.可以存储键值对的元素 2)与Collection接口的不同: ①Map是双列的 ...
- golang学习笔记17 爬虫技术路线图，python，java，nodejs，go语言，scrapy主流框架介绍
golang学习笔记17 爬虫技术路线图,python,java,nodejs,go语言,scrapy主流框架介绍 go语言爬虫框架:gocolly/colly,goquery,colly,chrom ...
- Nginx模块Lua-Nginx-Module学习笔记（二）Lua指令详解(Directives)
源码地址:https://github.com/Tinywan/Lua-Nginx-Redis Nginx与Lua编写脚本的基本构建块是指令. 指令用于指定何时运行用户Lua代码以及如何使用结果. 下 ...
- docker学习笔记17：Dockerfile 指令 ONBUILD介绍
ONBUILD指令可以为镜像添加触发器.其参数是任意一个Dockerfile 指令. 当我们在一个Dockerfile文件中加上ONBUILD指令,该指令对利用该Dockerfile构建镜像(比如为A ...
随机推荐
- 目标反射回波检测算法及其FPGA实现 之三：平方、积分电路及算法的顶层实现
目标反射回波检测算法及其FPGA实现之三: 平方.积分电路及算法的顶层实现 前段时间,接触了一个声呐目标反射回波检测的项目.声呐接收机要实现的核心功能是在含有大量噪声的反射回波中,识别出发射机发出的激 ...
- 关于DE2-115 FPGA开发板无法烧写程序的解决方法
友晶科技推出的DE2-115 FPGA开发板,有时候莫名奇妙,无法烧写或者固化程序.利用JTAG 向DE2-115开发板烧写.sof文件失败,并提示以下错误,如图1和图2所示 图1 图2 解决方法:只 ...
- 2017-2018-1 20155214 《信息安全系统设计基础》 第9周课下测试-mypwd
2017-2018-1 20155214 <信息安全系统设计基础> 第9周课下测试-mypwd(深入版) 题目要求: 1 学习pwd命令 2 研究pwd实现需要的系统调用(man -k; ...
- 20155217 2016-2017-2 《Java程序设计》第7周学习总结
20155217 2016-2017-2 <Java程序设计>第7周学习总结 教材学习内容总结 第十三章 13.1认识时间与日期 13.1.1时间的度量 1.格林威治标准时间(GMT):常 ...
- c++ 字符串和字符串库函数
//有2个字符串定义如下: //char s1[38]="www.yjxsoft"; //char s2[]=".com"; //请编写一段代码,把字符串s2追 ...
- Jmeter性能指标分析
以下是下载了服务器监控插件的各个组件的功能介绍,有助于以后jmeter的性能测试 1.jp@gc - Actiive Threads Over Time:不同时间的活动用户数量展示(图表) 当前的时间 ...
- python属性访问
1.python属性访问魔法方法: >>> class C: def __getattribute__(self,name): print("getattribute&qu ...
- 使用request+Beautiful爬取妹子图
一.request安装 pip install requests request使用示例 import requests response = requests.get('https://www.mz ...
- 增强学习训练AI玩游戏
1.游戏简介 符号A为 AI Agent. 符号@为金币,AI Agent需要尽可能的接取. 符号* 为炸弹,AI Agent需要尽可能的躲避. 游戏下方一组数字含义如下: Bomb hit: 代表目 ...
- 苏州地区--校招IT公司
完整经历了苏州的秋招和春招,在本校和苏州大学跑了许多次的宣讲会,自认为对苏州IT企业的校招有一个充分的认知.原本打算在苏州找一份Java开发的工作,可是发现自己简历连那些公司的简历关都过不去(对双非学 ...