Как вставить изображения на сервер вместо Base64 в angular7

Question

В настоящее время я работаю с ngx-quill в своем угловом проекте. Я пытаюсь добавить изображение с помощью редактора, но редактор загружает изображение в кодировке base64.

editorText : string
editorForm: FormGroup
editorContent: any
editorStyle = {
    height: '250px'
}
objectFormat = [
    { insert: 'Hello ' },
    { insert: 'World!', attributes: { bold: true } },
    { insert: '\n' }
]
myObjStr:string
config = {
    toolbar: {
        container:
            [
                ['image']
            ]
        }
    }
}


ngOnInit() {
    this.editorForm = new FormGroup({
        'editor': new FormControl(null)
    })

Любое предложение для процесса imageHandling для загрузки изображения на сервер

Answer 1

Это не будет загружать изображение для вас, но позволяет пользователю вставить URL-адрес изображения, если он уже размещен (например, функция вставки видео):

import { QuillModules, defaultModules } from 'ngx-quill';

export class MyComponent {

    quillModules: QuillModules = {
    toolbar: {
      container: defaultModules.toolbar, 
      handlers: {
        image: imageHandler
      }
    }
  };

}

function imageHandler(this: any) {
  imageHandler(this: any) {
    const tooltip = this.quill.theme.tooltip;
    const originalSave = tooltip.save;
    const originalHide = tooltip.hide;
    tooltip.save = function(this: any) {
      const range = this.quill.getSelection(true);
      const value = this.textbox.value;
      if (value) {
        this.quill.insertEmbed(range.index, 'image', value, 'user');
      }
    };
    // Called on hide and save.
    tooltip.hide = function (this: any) {
       tooltip.save = originalSave;
       tooltip.hide = originalHide;
       tooltip.hide();
    };
    tooltip.edit('image');
    tooltip.textbox.placeholder = "Embed URL";
  }
}

<quill-editor [modules]="quillModules"></quill-editor>