angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model。但在我们的项目当中会遇到这样的情况,后台返回的数据中带有各种各样的html标签.对于angular 1.2一下的版本我们必须要使用$sce这个服务来解决我们的问题。它可以通过使用$sce.trustAsHtml()。该方法将值转换为特权所接受并能安全地使用“ng-bind-html”。

   .controller('HealthEducationDetailCtrl', ['$sce','$scope', 'Storage', '$state', 'HomeService','$stateParams','$ionicTabsDelegate',
function ($sce,$scope, Storage, $state, HomeService,$stateParams,$ionicTabsDelegate) {
$scope.$on('$ionicView.beforeEnter', function() {
//关闭所有的tab选项卡
$ionicTabsDelegate.showBar(false);
}); //保证健康教育详情页面可以显示各自的标题
$scope.title=$stateParams.ARTICLE_TITLE;
var ARTICLE_ID=$stateParams.ARTICLE_ID;
var param={ARTICLE_ID:ARTICLE_ID};
HomeService.getHealthArticleDetail(param);
//加载健康教育详情
$scope.healthArticleDetail=[];
$scope.$on('HomeService.getHealthArticleDetail',function (event, data) {
$scope.healthArticleDetail=data;
//richTextReplace是解析html标识符
// $scope.trustHtml=Storage.richTextReplace($scope.healthArticleDetail.ARTICLE_CONTENTS);
$scope.trustHtml=$sce.trustAsHtml($scope.healthArticleDetail.ARTICLE_CONTENTS);
}) $scope.$on('$ionicView.beforeLeave', function() {
//打开所有tab选项卡
$ionicTabsDelegate.showBar(true);
});
}])

html code:

 <ion-view view-title="{{title}}" ng-view-title="title">
<ion-content >
<div style="width: 100%; padding: 10px 15px;">
<div ng-bind-html="trustHtml"></div>
</div>
</ion-content>
</ion-view>

angular用$sce服务来过滤HTML标签的更多相关文章

  1. 【转载】AngularJS 用$sce服务来过滤HTML标签,解决无法正确显示后台传递的html标签

    angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...

  2. angular中的ng-bind-html指令和$sce服务

    angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...

  3. angular中的ng-bind-html和$sce服务

    输入的内容存储在数据库中,然后再在数据库中将这些数据读写到页面上,比如你使用了某个第三方的脚本或者库.加载了一段html等等,可能会多了一些css的样式(显示在界面上) 这个时候我们可以利用angul ...

  4. angular ng-bind-html $sce.trustAsHtml

    使用ng-bind-html和$sce.trustAsHtml显示有html符号的内容   angularjs的强大之处之一在于它的双向数据绑定的功能,我们通常会使用data-ng-bind或者dat ...

  5. Angular.js之服务与自定义服务学习笔记

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. angular的uiRouter服务学习(3)

    本篇接着上一篇 angular的uiRouter服务学习(2) 继续讲解uiRouter的用法 本篇主要讲解uiRouter的多个命名的视图 我们可以给ui-view元素添加ui-view的值来给它命 ...

  7. php有效的过滤html标签,js代码,css样式标签

    过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...

  8. java正则表达式过滤html标签

    import java.util.regex.Matcher; import java.util.regex.Pattern; /** * <p> * Title: HTML相关的正则表达 ...

  9. 运用正则表达式在Asp中过滤Html标签代码的四种不同方法

    Function RemoveHTML(strHTML)Dim objregExp, Match, MatchesSet objRegExp = New RegexpobjRegExp.IgnoreC ...

随机推荐

  1. hibernate课程 初探单表映射3-2 基本类型

    本节内容:(介绍基本类型) 1 数据类型 简介 2 时间类型 简介 3 时间类型 demo 1 hibernate类型 java类型   integer/int java.lang.Integer/i ...

  2. .gitignore梳理

    参考来源: https://www.cnblogs.com/kevingrace/p/5690241.html 对于经常使用Git的朋友来说,.gitignore配置一定不会陌生.废话不说多了,接下来 ...

  3. C#之linq

    本文根据30分钟LINQ教程学习作的笔记. 1.Guid.Empty Guid 结构: 表示全局唯一标识符 (GUID).Empty字段:Guid 结构的只读实例,其值均为零.用来设置初始值.   G ...

  4. centos开机启动自定义脚本

    有些时候我们需要在服务器里设置一个脚本,让他一开机就自己启动.方法如下: cd /etc/init.d vi youshell.sh #将youshell.sh修改为你自己的脚本名 编写自己的脚本后保 ...

  5. HDU 1011 Starship Troopers星河战队(树形dp)

    题意 有n个洞穴编号为1-n,洞穴间有通道,形成了一个n-1条边的树, 洞穴的入口即根节点是1. 每个洞穴有x只bugs,并有价值y的金子,全部消灭完一个洞穴的虫子,就可以获得这个洞穴的y个金子. 现 ...

  6. [Hack] 搭建渗透测试实验环境

    安装虚拟机镜像,镜像如下: Kali-Linux-2016.1-vm-amd64(https://www.kali.org/) Metasploitable2-Linux(https://source ...

  7. innobackupex基于binlog日志的恢复 -- 使用mysqlbinlog恢复

    备份先做一次完整备份: innobackupex --defaults-file=/etc/my.cnf --user root --password chengce243 /data/mysqlba ...

  8. codeforce 599B Spongebob and Joke

    一道水题WA那么多发,也是醉了.f看成函数的话,其实就是判断一下反函数存不存在. 坑点,只能在定义域内判断,也就是只判断b[i].没扫一遍前不能确定Impossible. #include<bi ...

  9. IOS 一些好的框架和 技术大牛的博客

    http://blog.csdn.net/rodulf/article/details/51871093  比较好的框架链接: http://www.jianshu.com/p/9216c561b0f ...

  10. 【BZOJ4810】[YNOI2017] 由乃的玉米田(莫队+bitset)

    点此看题面 大致题意: 给你一段序列,每次询问一段区间内是否存在两个数的差或和或积为\(x\). 莫队算法 看到区间询问+可以离线,首先想到了莫队啊. 但是,在较短的时间内更新信息依然比较难以实现. ...