如何在angular7中插入服务器而不是Base64的图像

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)
    })

关于将图像上传到服务器的任何图像处理过程的建议

Answer 1

这不会为您上传图片，但允许用户粘贴已托管的图片网址（例如插入视频功能）：

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

export class MyComponent {

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

}

function imageHandler(this: any) {
  const tooltip = this.quill.theme.tooltip;
  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');
    }
  }
  tooltip.edit('image');
}

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