angular用$sce服务来过滤HTML标签
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标签的更多相关文章
- 【转载】AngularJS 用$sce服务来过滤HTML标签,解决无法正确显示后台传递的html标签
angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...
- angular中的ng-bind-html指令和$sce服务
angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...
- angular中的ng-bind-html和$sce服务
输入的内容存储在数据库中,然后再在数据库中将这些数据读写到页面上,比如你使用了某个第三方的脚本或者库.加载了一段html等等,可能会多了一些css的样式(显示在界面上) 这个时候我们可以利用angul ...
- angular ng-bind-html $sce.trustAsHtml
使用ng-bind-html和$sce.trustAsHtml显示有html符号的内容 angularjs的强大之处之一在于它的双向数据绑定的功能,我们通常会使用data-ng-bind或者dat ...
- Angular.js之服务与自定义服务学习笔记
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- angular的uiRouter服务学习(3)
本篇接着上一篇 angular的uiRouter服务学习(2) 继续讲解uiRouter的用法 本篇主要讲解uiRouter的多个命名的视图 我们可以给ui-view元素添加ui-view的值来给它命 ...
- php有效的过滤html标签,js代码,css样式标签
过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...
- java正则表达式过滤html标签
import java.util.regex.Matcher; import java.util.regex.Pattern; /** * <p> * Title: HTML相关的正则表达 ...
- 运用正则表达式在Asp中过滤Html标签代码的四种不同方法
Function RemoveHTML(strHTML)Dim objregExp, Match, MatchesSet objRegExp = New RegexpobjRegExp.IgnoreC ...
随机推荐
- maven 搭建springMvc+mybatis
1.在resource文件夹下创建Configure.xml <?xml version="1.0" encoding="UTF-8"?> < ...
- JavaScript中函数声明和函数表达式的区别
声明一个函数: var x=1; foo(); function foo() { console.log(x);//1 } myfun();//报错 定义一个函数表达式: var myfun=myfo ...
- Retrofit 2.0:有史以来最大的改进
因为其简单与出色的性能,Retrofit 是安卓上最流行的HTTP Client库之一. 不过它的缺点是在Retrofit 1.x中没有直接取消正在进行中任务的方法.如果你想做这件事必须手动杀死,而这 ...
- Android应用瘦身
转:https://zhuanlan.zhihu.com/p/25465537 瘦身的目的 从目的导向来看,我们是不会无缘无故去做一件事情的,那我们对应用瘦身的目的是为了什么?答案是:提高下载转化率. ...
- 使用CSS设置Chrome打印背景色
以下内容适用于Chrome浏览器 打印背景色可以通过在打印预览页面勾选背景图形实现 如果需要在用户不勾选的情况下依然能够打印背景色,可以通过css实现,如,table隔行设置背景色: .data-ta ...
- JS实现正则表达式
一.创建正则表达式 一共有两种方式: 1.直接量:var re = /[0-9]*/; 2.通过RegExp对象的构造函数:var re = RegExp("[0-9]*",&qu ...
- Win10 耳机无声音,扬声器有声音的解决办法
注:适用于WIN10及WIN10.ubuntu双系统耳机无声音的问题. 在WIN10的引导下,安装了Ubuntu的桌面版,作成了双系统,可是发现了一个问题:进入Win10后插耳机会没有声音,扬声器有声 ...
- cms系统-帖子页面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- ASP.NET MVC 长连接(服务器推)完整实现
1.什么是"服务器推"(百科来一波)? 传统模式的 Web 系统以客户端发出请求.服务器端响应的方式工作.这种方式并不能满足很多现实应用的需求,譬如: 监控系统:后台硬件热插拔.L ...
- co-dialog弹出框组件-版本v2.0.1
具体案例查看co-dialog:https://koringz.github.io/co-dialog/index.html 2.0.1版本优化项,代码压缩,修复PC和移动端自适应,修复显示弹出框浏览 ...