【问题描述】

angular js的强大之处之一就是他的数据双向绑定功能----->ng-bind和针对form的ng-model

但在我们的项目当中会遇到这样的情况,后台返回的数据中带有各种各样的html标签

angularJs输出html的时候,浏览器并不解析这些html标签

我们用ng-bind-html这样的指令来绑定,浏览器中显示的还是html代码

【解决办法---$sce】

通过使用$ sce.trustAsHtml()。该方法将值转换为特权所接受并能安全地使用“ng-bind-html”

咱们还可以这样用,把它封装成一个过滤器就可以在模板上随时调用了

filter code:

app.filter('to_trusted', ['$sce', function ($sce) {
  return function (text) {
  return $sce.trustAsHtml(text);
  };
}]);

html code:

<p ng-bind-html="currentWork.description | to_trusted"></p>

【AngularJs】---$sce 输出Html的更多相关文章

  1. AngularJS通过$sce输出html的方法

    不知道大家有没有发现在用AngularJS作为前端搭建个人博客的时候,发现用AngularJs输出html的时候,浏览器并不解析这些html标签,这里我们需要其显示angular输出的html能被浏览 ...

  2. Rust笔记

    前言: 学了有段时间了,现在同步到博客园. 正文: Rust语言介绍 l Rust由js之父开发的新型语言,打破了传统的难以接触底层的局面.这是个有C++开发的语言.拥有C的血统 l Rust必须严格 ...

  3. tomcat中配置jndi数据库源

    tomcat添加依赖 lib目录下添加依赖mysql-connector-java-8.0.16 配置数据源 介绍两种方法:tomcat中配置或web应用中配置 tomcat/conf/context ...

  4. web项目Log4j日志输出路径配置问题

    问题描述:一个web项目想在一个tomcat下运行多个实例(通过修改war包名称的实现),然后每个实例都将日志输出到tomcat的logs目录下实例名命名的文件夹下进行区分查看每个实例日志,要求通过尽 ...

  5. 5、AngularJS 直接绑定显示html ($sce、$sanitize服务)

    1.直接使用$sce服务(angularjs中:$sce.trustAsHtml($scope.snippet).html:ng-bind-html="snippet") 以下代码 ...

  6. 使用log4j输出日志

    今天在倒腾log4j,其实蛮简单的. 一.首先是下载log4j的jar包. 二.将下载的jar包添加到web工程的WEB-INF/lib包下 三.在src/config包下新建log4j.proper ...

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

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

  8. 一篇入门AngularJS

    目录 1.AngularJS 应用 2.AngularJS 指令 3.AngularJS 表达式 4.AngularJS 模型 5.AngularJS 控制器 6.AngularJS 作用域 7.An ...

  9. mapreduce多文件输出的两方法

    mapreduce多文件输出的两方法   package duogemap;   import java.io.IOException;   import org.apache.hadoop.conf ...

随机推荐

  1. Socket连接与HTTP连接

    我们在传输数据时,可以只使用(传输层)TCP/IP协议,但是那样的话,如果没有应用层,便无法识别数据内容,如果想要使传输的数据有意义,则必须使用到应用层协议,应用层协议有很多,比如HTTP.FTP.T ...

  2. HDU 4460 Friend Chains (BFS,最长路径)

    题意:给定 n 个人,和关系,问你这个朋友圈里任意两者之间最短的距离是多少. 析:很明显的一个BFS,只要去找最长距离就好.如果不能全找到,就是-1. 代码如下: #pragma comment(li ...

  3. baseadapter.getItemId的使用方法:实现listview筛选、动态删除

    转载:http://www.lai18.com/content/1631131.html 这里的listview筛选是指listview的adapter实现filter来过滤数据. “动态删除&quo ...

  4. UITableView section header 不固定

    iOS系统自带的UITableView,当数据分为多个section的时候,在UITableView滑动的过程中,默认section header是固定在顶部的,滑动到下一个section的时候,下一 ...

  5. Web.config之连接字介绍

    一.连接字配置方式 web.config中有两种方式来配置连接字:<appsetting>中配置,<connectionStrings>中配置. 1.<appsettin ...

  6. AJAX顺序输出

    转载:http://www.cnblogs.com/niunan/archive/2010/10/13/1849873.html AJAX顺序输出  在安装大多数CMS的时候都会在安装界面上看到这样的 ...

  7. ADO.NET 快速入门(十三):使用 OLE DB 检索数据

    OleDbDataReader 类提供了一种从数据源读取数据记录只进流的方法.如果想使用 SQL Server 7.0 或者更高版本,请参考文章:使用 SQL Server 检索数据.   OleDb ...

  8. 【M8】了解各种不同意义的new和delete

    1.首先考虑new operator,new operator 可以认为做了三件事情:a.调用operator new分配一块内存:b.在这块内存上调用构造方法构造对象:返回指针. 2.operato ...

  9. Codeforces Round #330 (Div. 2) A. Vitaly and Night 暴力

    A. Vitaly and Night Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/595/p ...

  10. Xcode8中Swift3.0适配问题

    写在前面 收到一些小伙伴的来信,觉得可能下边没有表达清楚,先把大家关心的要点在此进行总结,有兴趣的可以看看下边的研究过程,没兴趣的直接看这段即可. Xcode8支持Swift2.3和Swift3.0两 ...