beizhu
type
Post
status
Published
date
Mar 19, 2020
slug
summary
ckedior怎么写插件，ckedior上传图片plugins，ng2-ckedior上传图片的一些摸索，主要是ngAfterViewInit中的两个事件监听
tags
Angular
category
技术
icon
password
CKedior比较稳健，文档很全，支持插件，配置什么的也很友好，先给个文档链接感受一下：ckeditor在线文档https://docs.ckeditor.com/#!/guide/dev_installation。
ckeditor富文本编辑器上传图片目前想到的两个方法：
- 自己写一个上传插件（扩展性更强）
- 找到钩子函数监听事件（上传更通用）
一. 自己写一个上传插件
前言
毕竟每个人的需求都是不一样的，这时候一个编辑器的“可扩展性”就必不可少了。有了这个插件功能，你可以针对富文本编辑器做各种各样的事情，比如复制外站图片，自动上传到你指定的域名，并插入富文本编辑器中等等。
怎么写一个ckeditor的plugins
1. 文件夹
在ckeidtor的目录下有个plugins文件夹，我们要做的就在这个文件夹里，在plugins下新建一个文件夹，名称为你所命名的插件名，新建一个js。images文件夹用来存放用到的小图标.
2. plugin.js
2.1 创建编辑器命令
我们希望插件具有一个对话框窗口，因此我们需要定义一个编辑器命令来打开一个新的对话框窗口。要做到这一点，我们需要使用的editor.addCommand 函数注册abbr命令。业务逻辑 主要写在这块
2.2 创建工具栏按钮
2.3 CKEditor初始化
告诉CKEditor加载我们的插件了。为此，我们必须将其名称添加到
CKEDITOR.config.extraPlugins配置选项中：
Example
ps: 目前写的插件是用jquery针对自己项目使用的。没有写成一个通用型的插件
