Angularjs 1.3在页面中输出带Html标记的文本
如何Angularjs1.3在页面中输出带Html标记的文本
基于安全考虑,Angularjs不允许用ng-bind或者{{}}的方法输出html文本。
在实际的应用中,比如信息管理系统,用在线编辑器编辑出来的文章都带有html标记,这种情况下可以用ng-bind-html将其输出到前台页面。
1、在前台页面中包含sanitize.js
<script type="text/javascript" src="webjars/angular-sanitize/1.3.11/angular-sanitize.min.js"></script>
2、在mode、和controller增加对html文本的安全过滤
angular.module('scenceApp',['ui.router','ngResource','ngSanitize','restangular'])
.controller('scenceViewController',function($scope,Restangular,$stateParams, $sce){
Restangular.one("scences",$stateParams.id).get().
then(function(data) {
$scope.scence = data;
$scope.scence.info = $sce.trustAsHtml(data.info); //对info字段进行安全过滤
});
})
3、在前台页面中用ng-bind-html绑定
<div ng-bind-html="scence.info"></div>
文章参考资料:http://www.cnblogs.com/mingziday/p/4824899.html
Angularjs 1.3在页面中输出带Html标记的文本的更多相关文章
- 如何Angularjs1.3在页面中输出带Html标记的文本
基于安全考虑,Angularjs不允许用ng-bind或者{{}}的方法输出html文本. 在实际的应用中,比如信息管理系统,用在线编辑器编辑出来的文章都带有html标记,这种情况下可以用ng-bin ...
- 如何设置HTML页面中文本的字体
字体属性介绍 CSS中的字体属性是干什么的呢?字体字体肯定和字体有关咯,就是设置HTML页面中文本的字体, CSS中常用的字体属性有几种呢,笔者给大家梳理了下,比较常用的一共有5种,今天我们就看看这5 ...
- jQuery 中使用 DOM 操作节点,对页面中的表格实现增、删、查、改操作
查看本章节 查看作业目录 需求说明: 在 jQuery 中使用 DOM 操作节点,对页面中的表格实现增.删.查.改操作 点击"增加"超链接时,将表格中的第一条数据添加到表格的末尾 ...
- AngularJs调用NET MVC 控制器中的函数进行后台操作
题目中提到的控制器指的是.NET MVC的控制器,不是angularjs的控制器. 首先看主页面的代码: <!DOCTYPE html> <html> <head> ...
- AngularJS在IE下页面缓存问题
问题: 在使用AngularJS发出请求(GET)获取服务端数据,然后再绑定到页面中,你会发现在IE中总是显示原来的数据结果.这时候我们就会知道,IE做了缓存. 解决办法: 我们可以在AngularJ ...
- 页面中多个script块之间的关系
一:函数声明与函数定义表达式在函数调用间的区别 <script type="text/javascript"> doA(); var doA = function(a ...
- 【手记】WebBrowser响应页面中的blank开新窗口及window.close关闭本窗体
注:本文适用.net 2.0+的winform项目 目的: 点击页面中的target="_blank"链接时,弹出新窗体 页面中有window.close()操作时,关闭窗体 上述 ...
- 【问题】Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数
[问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: <button onclick="deleteProduct('@ ...
- WEB页面中常见的四种控件的必须的测试
以下为常规的需求,除非需求有明确说明,如密码输入框中可以输入空格. 输入框 1. 为空,但页面中明确说明不能为空(带有星号或者只有这一个输入框),有以下两种情况: a. 不进行输入或者使其为空:焦 ...
随机推荐
- FZU 2150 Fire Game (高姿势bfs--两个起点)
Description Fat brother and Maze are playing a kind of special (hentai) game on an N*M board (N rows ...
- flutter 接入阿里云OSS
之前因为使用正常文件上传,用户多时拥堵无法正常上传,因此接入阿里OSS 来解决这个问题.本来打算整原生那块,看了下比较麻烦,用flutter dio 直接请求oss 完成 1.上传用到了image_p ...
- 8086汇编和Win32汇编
8086汇编是指在某环境下汇编编译产生的程序,用机器去执行每条指令的长度为16位(可小于16),如DOS操作系统:WIN32汇编是32位环境下的汇编,如Windows(Windows也有64位的,XP ...
- Openstack组件部署 — Keystone Install & Create service entity and API endpoints
目录 目录 前文列表 Install and configure Prerequisites 先决条件 Create the database for identity service 生成一个随机数 ...
- Win10+CentOS7双系统引导修复
在有Win10的系统下安装了CentOS7后,CentOS7的引导并不会像CentOS6一样自动加载入Win10驱动.难道是grub2不能引导Win驱动?查了一下资料原来是CentOS不能识别Win1 ...
- springMvc注册时图形验证码完整代码与详细步骤``````后续更新注册时对密码进行加密
第一使用 画图软件制作图片 ,文件名就是验证码 ------用户的实体类 import java.util.Date; public class Member { private in ...
- shell /dev/null
/dev/null表示空设备,这里就是把日志记录到空设备里,就是不记录日志,Null 是一特殊指标值(或是一种物件参照 reference)表示这个指标并不指向任何的物件. 是一个特殊的文件,写入到它 ...
- python2和python3中int整型数据的不同之处
python2中的除法,结果为整型数字(int型),例如 10/5=2,10/3=3,小数位向下取整 python3中的除法,结果为浮点型数字(float型)结果小数位最多保留16位小数
- a number of 和the number of用法
a number of 和the number of用法 1. A number of + 複數名詞 + 複數動詞 =some/或a lot of + 複數名詞 + 複數動詞 ...
- 学习vim 从常用按键开始
ctrl+e 将屏幕下滚一行 ctrl+u 将屏幕上滚半页 ctrl+d 将屏幕下滚半页 ctrl+b 将屏幕上滚一页 ctrl+f 将屏幕下滚一页 撤销 u 前进 ctrl r 移动 下一个单词 ...