AngularJs在绑定数据时默认会以文本的形式出现在页面上,比如我现在有这样一段代码

<div ng-controller="testCtrl">{{data}}</div>

function testCtrl($scope) {
$scope.data = '<span class="red">标红</span>';
}

那么在页面上必然会在也面上直接显示 <span class="red">标红</span>

要想让包含html标签的字符串,能在页面上正常显示,就必须将其转义,此时就要用到angularjs的ng-bind-html,它可以将包含html标签的字符串进行转义然后正确的显示在页面上要使用ng-bind-html必须引入angular-sanitize.min.js这个文件,并在定义模块的时候,在app.js中注入ngSanitize才可以使用ng-bind-html

 
  <script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-sanitize.min.js"></script> <div ng-controller="testCtrl">
<div ng-bind-html="data"></div>
</div function testCtrl($scope) {
$scope.data = ''<span class="red">标红</span>';//记得要在app.js里面注入ngSanitize
}

  

Angular绑定数据时转义html标签的更多相关文章

  1. angular 绑定数据时添加HTML标签被识别的问题

    由于安全性,angular本身会对绑定的HTML标签属性进行转义,所以有些情况下我们需要用到绑定的数据里面传入html标签的时候, 需要用到一个服务:$sce $sce 服务下面的一个 $sce.tr ...

  2. 关于angularJS绑定数据时自动转义html标签

    关于angularJS绑定数据时自动转义html标签 angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签 ...

  3. angularJS绑定数据时自动转义html标签

    angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签中的注入攻击,但有些时候还是需要的,特别是从数据库读取 ...

  4. Spinner 通过XML形式绑定数据时 无法从String.xml中读取数组

    在android应用程序中,通过XML形式给Spinner绑定数据,如果把数组放在系统的string.xml文件里,那么就有可能在运行时无法找到,导致程序异常结束,解决方法是自建一个XML文件来存放数 ...

  5. winform Combox绑定数据时不触发SelectIndexChanged事件

    做了一个仓库选择的联动,选了仓库选其下的货区,选了货区选其下的货架分区.每个combox初始化.绑定数据是都会触发SelectIndexChanged事件,相当头疼. 后来无意中在网上看到了一种方法— ...

  6. MySql数据库-查询、插入数据时转义函数的使用

    最近在看一部php的基础视频教程,在做案例的时,当通过用户名查询用户信息的时候,先使用了转义函数对客户提交的内容进行过滤之后再交给sql语句进行后续的操作.虽然能看到转义函数本身的作用,但是仍然有一些 ...

  7. 使用Eval()绑定数据时使用三元运算符

    ASP.NET邦定数据“<%#Eval("Sex")%>”运用三元运算符: <%#(Eval("Sex", "{0}") ...

  8. ASP.NET - 使用 Eval() 绑定数据时使用 三元运算符

    ASP.NET邦定数据“<%#Eval("Sex")%>”运用三元运算符: <%#(Eval("Sex", "{0}") ...

  9. angular绑定数据

    Angular 中使用{{}}绑定业务逻辑里面定义的数据 <h1> Welcome to {{ title }}! /*引入title*/ </h1> export class ...

随机推荐

  1. 构建自己的Java并发模型框架

    Java的多线程特性为构建高性能的应用提供了极大的方便,可是也带来了不少的麻烦.线程间同步.数据一致性等烦琐的问题须要细心的考虑,一不小心就会出现一些微妙的,难以调试的错误. 另外.应用逻辑和线程逻辑 ...

  2. ZOJ Problem Set - 3829Known Notation(贪心)

    ZOJ Problem Set - 3829Known Notation(贪心) 题目链接 题目大意:给你一个后缀表达式(仅仅有数字和符号),可是这个后缀表达式的空格不幸丢失,如今给你一个这种后缀表达 ...

  3. win8/win10/win2012r2 存储池 冗余分析

    StorageSpace:a. Simple,相当于RAID0,无冗余,不考虑b. Two-way Mirror,双重镜像,至少2块盘,性能单盘,可以坏一块盘c. Three-way Mirror,三 ...

  4. C++学习笔记9-运算符重载

    1. 重载运营商必须有一个类类型的操作数 对于内置类型运营商.它的意义不能改变. 例如,内置整数加法运算不能被重新定义: // error: cannotredefine built-in opera ...

  5. Vim配置说明

    使用这些天一直vim,我认为vim这是一个非常强大的编辑器,尤其是后配置. 互联网参考大牛个月vim配置,然后更改加入了一部分,形成了自己的配置.让Vim变的更强大. 详细有下面几个特点: 1.自己主 ...

  6. effective c++ 条款18 make interface easy to use correctly and hard to use incorrectly

    举一个容易犯错的例子 class Date { private: int month; int day; int year; public: Date(int month,int day,int ye ...

  7. Godaddy Drupal Update

    Godaddy对Drupal默认安装仅仅支持到7.22,眼下Drupal已经升级到7.28,安装完Drupal 7.22后,仅仅能手工升级. 安装Drupal在:https://hostingconn ...

  8. DFA和trie特里实现敏感词过滤(python和c语言)

    今天的项目是与完成python开展,需要使用做关键词检查,筛选分类,使用前c语言做这种事情.有了线索,非常高效,内存小了,检查快. 到达python在,第一个想法是pip基于外观的c语言python特 ...

  9. php+sqlite cms

    1 phpSQLiteCMS 最新版本 phpSQLiteCMS 2.0.4 http://phpsqlitecms.net/ 2 taoCMS  最新版本 [2.5Beta5下载地址] 需要php ...

  10. (2) 用DPM(Deformable Part Model,voc-release4.01)算法在INRIA数据集上训练自己的人体检測模型

    步骤一,首先要使voc-release4.01目标检測部分的代码在windows系统下跑起来: 參考在window下执行DPM(deformable part models) -(检測demo部分) ...