我正在寻找一个示例,显示使用Angular 5为CKEditor 5实现自定义图像上传器 .
不需要该适配器的Angular特定版本 .
您可以使用例如:https://github.com/pourquoi/ckeditor5-simple-upload或尝试将其与CKFinder集成 .
然后,您需要做的就是将配置对象传递给 <ckeditor [config]='config'> 组件 .
<ckeditor [config]='config'>
或者,您可以自己创建它 . 这应该是上传适配器的基本框架,应与UploadAdapter interface匹配:
editor.plugins.get( 'FileRepository' ).createUploadAdapter = loader => { return new UploadAdapter( loader, editor.config.get( 'uploadUrl' ), editor.t ); } class UploadAdapter { constructor( loader, url, t ) { this.t = t; // Translate function this.loader = loader; this.url = url; // Endpoint URL } upload() { // Perform uploading and return a promise to that action. } abort() { // Abort current upload process. } }
整个过程在文档中有更深入的描述:https://ckeditor.com/docs/ckeditor5/latest/framework/guides/deep-dive/upload-adapter.html . 您还可以查看https://github.com/pourquoi/ckeditor5-simple-upload/blob/master/src/adapter.js的源代码
然后,要获取 ckeditor5-angular 包中的 editor 属性,您需要侦听 ready 事件并获取编辑器参数:
ckeditor5-angular
editor
ready
<editor [ready]="onReady" ...></editor>
@Component() class EditorComponent { public onReady( editor ) { // Now you can acess the editor. } }
这就是它 .
1 回答
不需要该适配器的Angular特定版本 .
您可以使用例如:https://github.com/pourquoi/ckeditor5-simple-upload或尝试将其与CKFinder集成 .
然后,您需要做的就是将配置对象传递给
<ckeditor [config]='config'>
组件 .或者,您可以自己创建它 . 这应该是上传适配器的基本框架,应与UploadAdapter interface匹配:
整个过程在文档中有更深入的描述:https://ckeditor.com/docs/ckeditor5/latest/framework/guides/deep-dive/upload-adapter.html . 您还可以查看https://github.com/pourquoi/ckeditor5-simple-upload/blob/master/src/adapter.js的源代码
然后,要获取
ckeditor5-angular
包中的editor
属性,您需要侦听ready
事件并获取编辑器参数:这就是它 .