AngularJs编辑器
问题:在使用过程中遇到的问题就是:angularJS绑定不上值。后来找到一种可以用的方式。
html页
<div class="all">
<script type="text/html" style="margin:auto;height:300px;width:100%;" ng-model="LogContent" meta-umeditor
meta-umeditor-config='all_config'
meta-umeditor-placeholder="请填写日志内容!">
</script>
</div>
controller里要初始化
$scope.LogContent = ""; $scope.all_config = {};
脚本引用
<link href="http://dylike.github.io/meta.umeditor/bower_components/meta.umeditor/lib/umeditor/dist/utf8-php/themes/default/css/umeditor.css"
type="text/css" rel="stylesheet">
<script src="http://dylike.github.io/meta.umeditor/bower_components/meta.umeditor/lib/umeditor/dist/utf8-php/third-party/jquery.min.js"></script>
<script src="http://dylike.github.io/meta.umeditor/bower_components/meta.umeditor/lib/umeditor/dist/utf8-php/umeditor.min.js"></script>
<script src="http://dylike.github.io/meta.umeditor/bower_components/meta.umeditor/lib/umeditor/dist/utf8-php/umeditor.config.js"></script>
<script src="http://dylike.github.io/meta.umeditor/bower_components/meta.umeditor/src/meta.umeditor.js"></script>
这样就可以用了。
【问题描述】
这时取到的数据中带有各种各样的html标签,angularJs输出html的时候,浏览器并不解析这些html标签
我们用ng-bind-html这样的指令来绑定,浏览器中显示的还是html代码。
【解决办法---$sce】
通过使用$ sce.trustAsHtml()。该方法将值转换为特权所接受并能安全地使用“ng-bind-html”
要这样设置一下logList[i].LogContent = $sce.trustAsHtml(logList[i].LogContent);
就可以得到纯文本了。
注:仅个人理解和总结,有误处请各位指正
AngularJs编辑器的更多相关文章
- AngularJS学习(二)——Angular应用的解析
本节描述AngularJS应用程序的三个组成部分,并解释它们如何映射到模型-视图-控制器设计模式 模板(Template) 模板是您用HTML和CSS编写的文件,展现应用的视图.您可给HTML添加新的 ...
- 开源的api文档管理系统
api文档 php 在项目中,需要协同开发,所以会写许多API文档给其他同事,以前都是写一个简单的TXT文本或Word文档,口口相传,这种方式比较老土了,所以,需要有个api管理系统专门来管理这些ap ...
- API管理工具
开源的api文档管理系统 api文档 php 在项目中,需要协同开发,所以会写许多API文档给其他同事,以前都是写一个简单的TXT文本或Word文档,口口相传,这种方式比较老土了,所以,需要有个api ...
- 基于 Angularjs&Node.js 云编辑器架构设计及开发实践
基于 Angularjs&Node.js 云编辑器架构设计及开发实践 一.产品背景 二.总体架构 1. 前端架构 a.前端层次 b.核心基础模块设计 c.业务模块设计 2. Node.js端设 ...
- angularjs中展示富文本编辑器文本,向DOM中插入元素
前几天在用textangular富文本编辑器插件时,将存储的文本及格式存储到数据库中,但是从后台接口中再向angular页面插入时却不能执行,即在Angular中操作DOM没有实现,后来查看了一下,操 ...
- Angularjs在线编辑器
1.TextAngular: https://github.com/fraywing/textAngular textAngular是一个强大的Text-Editor/Wysiwyg 编辑器,用于An ...
- AngularJS集成富文本编辑器
最近在Angular中需要集成富文本编辑器,本来已经集成好百度的UEditor,后台觉得配置太多,让我弄个别的,然后就找到了wangEditor,这个配置和上手都要简单一些,下面来看看具体操作步骤吧: ...
- AngularJs最简单解决跨域问题案例
AngularJs最简单解决跨域问题案例 2016-05-20 09:18 82人阅读 评论(0) 收藏 举报 分类: javascript(1) 作者:白狼 出处:http://www.mank ...
- AngularJS入门教程
1. 简介:AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也可以觉得是 ...
随机推荐
- 关于css文字的扩展
1.不换行: .title{ white-space:nowrap; text-overflow:ellipsis; } 2.超出变三点 .title{ white-space:nowrap; tex ...
- vim 编码方式的设置
和所有的流行文本编辑器一样,Vim 可以很好的编辑各种字符编码的文件,这当然包括UCS-2.UTF-8 等流行的 Unicode 编码方式.然而不幸的是,和很多来自 Linux 世界的软件一样,这需要 ...
- 简评搜狗输入法(ios端)
首先说说为什么不使用iPhone自带的输入法呢,首先是词库不够丰富,好多简单的词语需要逐个字逐个字的选择,记忆功能不太好,其次是全键盘式的输入我不太习惯,还是九宫格的输入法比较简单,更方便快捷. 搜狗 ...
- SpringMVC相关的面试题
1.什么是springMVC springmvc是spirng框架的一个模块,是一个基于MVC框架的web框架 2.springmvc的流程 a.客户端发送请求 b.前端控制器DispatcherSe ...
- HDU 5191 Building Blocks
题目链接: hdu:http://acm.hdu.edu.cn/showproblem.php?pid=5191 bc(中文):http://bestcoder.hdu.edu.cn/contests ...
- Windows下IntelliJ IDEA中调试Spark Standalone
参考:http://dataknocker.github.io/2014/11/12/idea%E4%B8%8Adebug-spark-standalone/ 转载请注明来自:http://www.c ...
- Scrum 项目准备4.0
4.0----------------------------------------------- 1.准备看板. 形式参考图4. 2.任务认领,并把认领人标注在看板上的任务标签上. 先由个人主动领 ...
- 1st 结对编程:简易四则运算
结对编程:简易四则运算 功能:进行简易的四则运算,并根据给出的结果判断正误. 实现:使用java的图形化界面实现. 导入包库 package six; import javax.swing.*; im ...
- Winform程序在XP系统上双击运行无反应解决方法
右键程序,打开属性栏,在兼容性选项里以兼容模式运行该程序即可解决.
- jquery实现可编辑的下拉框( input + select )
HTML: <input id="inputModel" /> <select name="EngineModel" size="1 ...