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. python基本数据类型,int,bool,str

    一丶python基本数据类型 1.int 整数,主要用来进行数学运算. 2.str 字符串,可以保存少量数据并进行相应的操作 3.bool 判断真假.True.False 4.list 存储大量数据, ...

  2. WPF学习一:XAML的资源(Resources)结构

    一个初学者,把知识做个积累,如果有不对的地方,还请高手指出,谢谢! 先看一段代码:(下面是以Window WPF进行讲解,如果是Web 的话就把<Window改为<Page 而如果是 Us ...

  3. Sqlserver计算本年度工作日

    --@StartDate 本年度第一天 --@EndDate 本年度最后一天 , ) , DATEADD(yy, , , )) IF EXISTS ( SELECT * FROM tempdb..sy ...

  4. jQuery_2_常规选择器-进阶选择器

    进阶选择器: 1. 群组选择器     $("span,em,#box")   获取多个选择器的DOM对象 <div id="d1">div< ...

  5. mybatis-mybatis-config.xml详细介绍

    1.mybatis-config.xml 1.1:配置,配置可以是引入外部文件,也可以是在本文件内写配置 <!-- <properties resource="jdbc.prop ...

  6. cms-首页搭建

    主页面主要有3个部分构成,头部.主体内容部分.尾部 1.头部: <%@ page language="java" contentType="text/html; c ...

  7. yii:高级应用程序搭建数据库的详细流程

    上一章已经把高级应用程序的环境搭配成功,那么下一步就是搭建数据库了. 首先,我们先去创建一个数据库,比如:demo 创建完之后,我们重要的就是将文件中的数据进行一个更新,在www/advancend/ ...

  8. C++指针的概念解读

    C++指针的概念解读 超详细 指针是一个特殊的变量,它里面存储的数值被解释成为内存里的一个地址.要搞清一个指针需要搞清指针的四方面的内容:指针的类型,指针所指向的类型,指针的值或者叫指针所指向的内存区 ...

  9. hdu1863 畅通工程---MST&连通

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1863 题目大意: 中文题,求MST权值,如果不连通,输出? 解题思路: 这道题帮我找出了之前模板中的 ...

  10. Python F-string 更快的格式化

    Python的格式化有%s,format,F-string,下面是比较这三种格式化的速度比较 In [12]: a = 'hello' In [13]: b = 'world' In [14]: f' ...