对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 相关文章推荐
浏览器脚本兼容 文本框中,回车键触发事件的兼容
Jun 21 Javascript
5个javascript的数字格式化函数分享
Dec 07 Javascript
jQuery实现下拉框选择图片功能实例
Aug 08 Javascript
jQuery鼠标事件汇总
Aug 30 Javascript
Position属性之relative用法
Dec 14 Javascript
jQuery Ajax请求后台数据并在前台接收
Dec 10 Javascript
微信小程序 Canvas增强组件实例详解及源码分享
Jan 04 Javascript
jQuery EasyUI Panel面板组件使用详解
Feb 28 Javascript
百度地图JavascriptApi Marker平滑移动及车头指向行径方向
Mar 13 Javascript
angular4中*ngFor不能对返回来的对象进行循环的解决方法
Sep 12 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
Jan 20 Javascript
Rust中的Struct使用示例详解
Aug 14 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
php echo()和print()、require()和include()函数区别说明
2010/03/27 PHP
php异常处理技术,顶级异常处理器
2012/06/13 PHP
php实现遍历文件夹的方法汇总
2017/03/02 PHP
javascript 哈希表(hashtable)的简单实现
2010/01/20 Javascript
纯JavaScript实现的完美渐变弹出层效果代码
2010/04/02 Javascript
javascript自动恢复文本框点击清除后的默认文本
2016/01/12 Javascript
jquery 无限极下拉菜单的简单实例(精简浓缩版)
2016/05/31 Javascript
Bootstrap基本组件学习笔记之进度条(15)
2016/12/08 Javascript
基本DOM节点操作
2017/01/17 Javascript
PHP7新特性简述
2017/06/11 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
2018/11/15 Javascript
深入学习JavaScript 高阶函数
2019/06/11 Javascript
Node.js文本文件BOM头的去除方法
2020/11/22 Javascript
微信小程序反编译的实现
2020/12/10 Javascript
[02:14]完美“圣”典2016风云人物:xiao8专访
2016/12/01 DOTA
[51:00]Secret vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
python采用getopt解析命令行输入参数实例
2014/09/30 Python
Python使用time模块实现指定时间触发器示例
2017/05/18 Python
Python 中判断列表是否为空的方法
2019/11/24 Python
pycharm如何实现跨目录调用文件
2020/02/28 Python
在Ubuntu 20.04中安装Pycharm 2020.1的图文教程
2020/04/30 Python
Python实现定时监测网站运行状态的示例代码
2020/09/30 Python
python数据抓取3种方法总结
2021/02/07 Python
如何用python爬取微博热搜数据并保存
2021/02/20 Python
css3实现的多级渐变下拉菜单导航效果代码
2015/08/31 HTML / CSS
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
注塑工厂厂长岗位职责
2013/12/02 职场文书
一月红领巾广播稿
2014/02/11 职场文书
物理系毕业生自荐书范文
2014/02/22 职场文书
体育专业大学生职业生涯规划范文:打造自己的运动帝国
2014/09/12 职场文书
国家税务局领导班子对照检查材料思想汇报
2014/10/04 职场文书
2015年扫黄打非工作总结
2015/05/13 职场文书
2019行政前台转正申请书范文3篇
2019/08/15 职场文书
HTML+CSS+JS实现图片的瀑布流布局的示例代码
2021/04/22 HTML / CSS
手把手教你实现PyTorch的MNIST数据集
2021/06/28 Python
linux下安装redis图文详细步骤
2021/12/04 Redis