1、TextAngular:
https://github.com/fraywing/textAngular

textAngular是一个强大的Text-Editor/Wysiwyg 编辑器,用于Angular.js应用中。
安装使用方便,可以创建多个编辑器实例,双向绑定HTML内容,可以查看编辑内容的变化。
不足之处是不支持上传文件到服务器,只能进行简单的文字编辑,可用于网站的用户评论模块


2、angular.xheditor:

https://github.com/cipchk/angular.xheditor

xhEditor的AngularJS版本,没有研究


3、angular-ueditor:

http://inhu.net/publish-angular-ueditor.html

Ueditor是百度提供的在线编辑器,功能非常丰富,angular-ueditor 是一款整合了 angular 和 UEditor 的插件。目的是为了更方便的在angular基础上使用UEditor。
安装非常方便:

(1)首先到官网下载百度ueditor1_4_3-utf8-jsp.zip

(2)解压ueditor1_4_3-utf8-jsp.zip到自己的工程web目录,将jsp/lib目录下的jar包剪切到WEB-INF/lib目录下,这些jar是用来进行文件上传操作的,如果缺少的话是无法进行文件上传动作的。

(3)下载angular-ueditor-master.zip,解压缩后,将其中的angular-ueditor.js拷贝到自己的工程web目录中

(4)在单页面应用中需要增加的js文件

<script type="text/javascript" src="ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="angular-ueditor.js"></script>

(5)在app.js中将angular-ueditor引入到模块;在html应用中并绑定ng-model

angular.module('app', ['ng.ueditor'])
......
<div class="ueditor" ng-model="content"></div>

(6)上传图片默认路径的修改(参考www . suchso . com/UIweb/baidu-UEditor-image-upload-config-url.html)

所有的上传配置选项都在一个文件中配置,这个文件就是ueditor/jsp/config.json,例如imagePathFormat表示了文件上传到什么目录下。

"imagePathFormat": "./ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}"

Angularjs在线编辑器的更多相关文章

  1. 在ASP.NET Core中使用百度在线编辑器UEditor

    在ASP.NET Core中使用百度在线编辑器UEditor 0x00 起因 最近需要一个在线编辑器,之前听人说过百度的UEditor不错,去官网下了一个.不过服务端只有ASP.NET版的,如果是为了 ...

  2. 在线编辑器的使用-KindEditor

    第一种:KindEditor编辑器 步骤一:加载相应的核心的文件 下载地址:http://kindeditor.net/demo.php <link rel="stylesheet&q ...

  3. js组件在线编辑器插件、图表库插件、文件树插件

    在线编辑器插件: 一.kindeditor 二.UEditor 图表库插件: 一.echart 二.highchart 文件树插件: 一.zTree -- jQuery 树插件 http://www. ...

  4. Method Draw – 很好用的 SVG 在线编辑器

    Method Draw 是一款在线 SVG 编辑器,是 SVG Edit 的一个分支.Method Draw 的目的是改进 SVG Edit 的可用性和用户体验.它移除了 line-caps/corn ...

  5. 百度在线编辑器UEditor(v1.3.6) .net环境下详细配置教程之更改图片和附件上传路径

    本文是接上一篇博客,如果有疑问请先阅读上一篇:百度在线编辑器UEditor(v1.3.6) .net环境下详细配置教程 默认UEditor上传图片的路径是,编辑器包目录里面的net目录下 下面就演示如 ...

  6. 百度在线编辑器UEditor(v1.3.6) .net环境下详细配置教程

    UEditor是百度开发团队奉献的一款很不错的在线编辑器.在百度自己很多产品上都有应用,本文主要是该编辑器的配置教程. 1.下载UEditor,当前最新版本是1.3.6.这里下载的.net版本,选择U ...

  7. 05传智_jbpm与OA项目_部门模块中增加部门的jsp页面增加一个在线编辑器功能

    这篇文章讲的是在线编辑器功能,之前的部门模块中,增加部门的功能jsp页面起先是这么做的.

  8. 将kindeditor在线编辑器制作成smarty插件

    在web开发中,在线编辑器是经常要用到的功能模块,虽说配置在线编辑器没有多大难度,但是每一次编写重复的代码,总是让人感觉不爽. 本篇,就来讲解一下,如何将kindeditor制作成smarty的一个自 ...

  9. 在线编辑器 (UBB, FCK)

    这里主要说明一下:UBB UBB 使用类型HTML的语法.  UBB相对FCK的HTML方式, 安全性高. 用户不可以直接嵌入HTML代码.   UBB 在线编辑器(JS版): http://www. ...

随机推荐

  1. memset用法详解(转)

    问题描述: int * cow = new int[n+1]; memset(cow,0,(n+1)*4); 将N+1个元素置成0,为什么不行 memset是对一个字节的int4个字节,因此*4 但是 ...

  2. 关于AutoComplete整合

    AutoComplete应该不是很陌生了,网上也有好多开源的js.今天主要的不是研究Autocomplete这个js的实现.今天主要讲的是将这个js做成一插件.那么今天主要用到的 js插件jquery ...

  3. win7重新安装win7

    本方法适用于原本Win7系统下安装,无需U盘,非Ghost,简单几步操作之后与光盘安装过程一样,简便易操作,愿与和我一样有“洁癖”的朋友分享. 1.下载Win7原版光盘镜像,附下载地址: Win7旗舰 ...

  4. C 高级编程 2 内存管理

    理解malloc的工作原理: malloc使用一个数据结构(链表)来维护分配的空间.链表的构成: 分配的空间.上一个空间的地址.下一个空间的地址.以及本空间的信息等. 对malloc分配的空间不要越界 ...

  5. POJ 2498 Martian Mining

    Martian Mining Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 2194   Accepted: 1326 De ...

  6. Apache Shiro Architecture--官方文档

    原文地址:http://shiro.apache.org/architecture.html Apache Shiro's design goals are to simplify applicati ...

  7. 使用C#通过Thrift访问HBase

    前言 因为项目需要要为客户程序提供C#.Net的HBase访问接口,而HBase并没有提供原生的.Net客户端接口,可以通过启动HBase的Thrift服务来提供多语言支持. Thrift介绍 环境 ...

  8. 视频-某hadoop高级应用-搜索提示

    看了北风的免费视频,只有一个案例,苦逼买不起几百上千的视频教程 先搭建简单的web项目,基于struts,使用到了bootstrap. 界面: web.xml <filter> <f ...

  9. 浅谈xss攻击

    近期学习过程中提到xss攻击的问题,便想要了解一下,总结如下: XSS攻击:跨站脚本攻击(Cross Site Scripting),为不和层叠样式表(Cascading Style Sheets, ...

  10. mysql颠覆实战笔记(三)-- 用户登录(二):保存用户操作日志的方法

    版权声明:笔记整理者亡命小卒热爱自由,崇尚分享.但是本笔记源自www.jtthink.com(程序员在囧途)沈逸老师的<web级mysql颠覆实战课程 >.如需转载请尊重老师劳动,保留沈逸 ...