angular - 如何在 CKEditor5 Angular 中编写自定义上传适配器

Question

我正在寻找在 CKEditor5 中构建用于上传图像的自定义上传适配器。

我的代码是：

零件：

 import { Component } from '@angular/core';
 import * as ClassicEditor from '@ckeditor/ckeditor5-build-classic';
 import Base64UploadAdapter from '@ckeditor/ckeditor5- 
 upload/src/base64uploadadapter';


 @Component({
 selector: 'app-root',
 templateUrl: './app.component.html',
 styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'ckeditor';
  public Editor = ClassicEditor;

  ckconfig = {
    // include any other configuration you want
    extraPlugins: [ this.TheUploadAdapterPlugin ]
  };

  TheUploadAdapterPlugin(editor) {
    console.log('TheUploadAdapterPlugin called');
    editor.plugins.get('FileRepository').createUploadAdapter = (loader) => {
      // return new UploadAdapter(loader, '/image');
      return "hello";
    };
  }

  class UploadAdapter {
    loader;  // your adapter communicates to CKEditor through this
    url;
    constructor(loader, url) {
      this.loader = loader;   
      this.url = url;
      console.log('Upload Adapter Constructor', this.loader, this.url);
    }

    upload() {
      return new Promise((resolve, reject) => {
        console.log('UploadAdapter upload called', this.loader, this.url);
        console.log('the file we got was', this.loader.file);
        resolve({ default: 'http://localhost:8080/image/1359' });
      });
    }

    abort() {
      console.log('UploadAdapter abort');
    }
  }  
}

我收到错误消息“意外的令牌。应有构造函数、方法、访问器或属性。” 对于 UploadAdapter 类。知道为什么吗？

此外，图像上传似乎无法以这种方式工作。是否有任何在线可用的实施示例。我找不到任何东西。

标签： angularckeditor5