对angularJs中$sce服务安全显示html文本的实例


Posted in Javascript onSeptember 30, 2018

如下所示:

<div ng-app="module" ng-controller="ctrl">
 {{data}}
 <hr>
 <div ng-bind-html="data"></div>
 <hr>
 <div ng-bind-html="title | trustHtml"></div>
</div>
<script>
 var m = angular.module('module', []);
 /*$sce服务写成过滤器*/
 m.filter('trustHtml',['$sce',function($sce){
  return function(data){
   return $sce.trustAsHtml(data);
  }
 }])
 m.controller('ctrl', ['$scope', '$sce', function ($scope, $sce) {
 /*第一种:不用过滤器的方式*/
  $scope.data = $sce.trustAsHtml('<h1 style="color:red;">angularJs</h1>');
   /*第二种:使用过滤器的方式*/
  $scope.title = '<h3 style="color:red;">angularJs</h3>';
 }]);
</script>

以上这篇对angularJs中$sce服务安全显示html文本的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js下用层来实现select的title提示属性
Feb 23 Javascript
JavaScript 参数中的数组展开 [译]
Sep 21 Javascript
url参数中有+、空格、=、%、&amp;、#等特殊符号的问题解决
May 15 Javascript
javascript实现复选框超过限制即弹出警告框的方法
Feb 25 Javascript
js密码强度校验
Nov 10 Javascript
Bootstrap和Java分页实例第二篇
Dec 23 Javascript
使用jQuery操作DOM的方法小结
Feb 27 Javascript
JS 实现缓存算法的示例(FIFO/LRU)
Mar 20 Javascript
详解React中setState回调函数
Jun 14 Javascript
详解如何在Javascript和Sass之间共享变量
Nov 13 Javascript
基于vue3.0.1beta搭建仿京东的电商H5项目
May 06 Javascript
原生JS实现天气预报
Jun 16 Javascript
vue  自定义组件实现通讯录功能
Sep 30 #Javascript
对angularJs中2种自定义服务的实例讲解
Sep 30 #Javascript
angularJs在多个控制器中共享服务数据的方法
Sep 30 #Javascript
iview Upload组件多个文件上传的示例代码
Sep 30 #Javascript
VUE 配置vue-devtools调试工具及安装方法
Sep 30 #Javascript
angularJs中orderBy筛选以及filter过滤数据的方法
Sep 30 #Javascript
jQuery实现点击图标div循环放大缩小功能
Sep 30 #jQuery
You might like
通过ICQ网关发送手机短信的PHP源程序
2006/10/09 PHP
php tp验证表单与自动填充函数代码
2012/02/22 PHP
PHP中调用SVN命令更新网站方法
2015/01/07 PHP
PHP编写daemon process 实例详解
2016/11/13 PHP
PHP使用DOM和simplexml读取xml文档的方法示例
2017/02/08 PHP
尽可能写&quot;友好&quot;的&quot;Javascript&quot;代码
2007/01/09 Javascript
运用jQuery定时器的原理实现banner图片切换
2014/10/22 Javascript
Node.js的Express框架使用上手指南
2016/03/12 Javascript
JavaScript字符串对象
2017/01/14 Javascript
基于JavaScript实现的顺序查找算法示例
2017/04/14 Javascript
js原生方法被覆盖,从新赋值原生的方法
2018/01/02 Javascript
vuex 使用文档小结篇
2018/01/11 Javascript
VUE引入第三方js包及调用方法讲解
2019/03/01 Javascript
通过JS深度判断两个对象字段相同
2019/06/14 Javascript
Vue项目中使用WebUploader实现文件上传的方法
2019/07/21 Javascript
layuiAdmin循环遍历展示商品图片列表的方法
2019/09/16 Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
2020/04/10 Javascript
vue实现鼠标经过动画
2019/10/16 Javascript
vue中使用vee-validator完成表单校验方案
2019/11/01 Javascript
Vue中import from的来源及省略后缀与加载文件夹问题
2020/02/09 Javascript
基于javascript实现碰撞检测
2020/03/12 Javascript
Vue封装全局过滤器Filters的步骤
2020/09/16 Javascript
python进阶教程之循环相关函数range、enumerate、zip
2014/08/30 Python
Python中unittest模块做UT(单元测试)使用实例
2015/06/12 Python
python操作mysql代码总结
2018/06/01 Python
对sklearn的使用之数据集的拆分与训练详解(python3.6)
2018/12/14 Python
centos+nginx+uwsgi+Django实现IP+port访问服务器
2019/11/15 Python
Python GUI编程学习笔记之tkinter界面布局显示详解
2020/03/30 Python
python的链表基础知识点
2020/09/13 Python
宝塔面板出现“open_basedir restriction in effect. ”的解决方法
2021/03/14 PHP
香港网上花店:FlowerAdvisor香港
2019/05/30 全球购物
西班牙购买行李箱和背包网站:Maletas Greenwich
2019/10/08 全球购物
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
七年级地理教学反思
2014/01/26 职场文书
2014年小学体育工作总结
2014/12/11 职场文书
解决mysql的int型主键自增问题
2021/07/15 MySQL