Question

你好

   public options: Object = {
      events: {
        'froalaEditor.image.beforeUpload': function(e, editor, images) {

            alert('')
        }
    }
}

上传图片后事件不起作用

Answer 1

您需要将axios安装到项目中，以帮助发送请求：

为此，请运行以下命令

npm install axios

此后，您有几个允许将图像上传到服务器的选项，但是最重要的是，必须将imageUpload属性设置为true，有关更多信息，请参见下面的代码片段：

public options: Object = {
  charCounterCount: true,
  imageUpload: true,
  imageUploadMethod: 'POST',
  // Set max image size to 5MB.
  imageMaxSize: 5 * 1024 * 1024,
  events: {
    'froalaEditor.image.beforeUpload': function(e, editor, images): any {
      // Before image is uploaded
      const data = new FormData();
      data.append('image', images[0]);

      axios.post('your_imgur_api_url', data, {
        headers: {
          'accept': 'application/json',
          'Authorization': 'your_imgur_client_id/api_key',
          'Accept-Language': 'en-US,en;q=0.8',
        }
      }).then(res => {
        editor.image.insert(res.data.data.link, null, null, editor.image.get());
      }).catch(err => {
        console.log(err);
      });
      return false;
    }
  }
};

Froala编辑器-图像上传事件不起作用-Angular 9

1 个答案: