Question

我想上传多张图片，然后再提交到服务器中。到目前为止，我正在提交带有attach_images参数的单个图像，但我必须提交带有option_images参数的多个图像，我该如何实现？

我有用于上传单个图像的代码。我要添加什么编码？

<input id="custom-input" type="file" (change)="handleFiles($event)" multiple >

handleFiles = function (fileInput: Event) {
    debugger;
debugger;
        this.imageArr = ['image/jpeg', 'image/jpg', 'image/png','image/gif'];


    if (fileInput.target['files'][0]['size'] > 1024000) {
        $.growl.error({ title: 'Error', message: "File can not be larger than 1 MB" });
        return;
    }
    if (!this.imageArr.includes(fileInput.target['files'][0]['type'])) {
        $.growl.error({ title: 'Error', message: "Invalid file format." });
        return;
    }

    var file: File = fileInput.target['files'][0];

        this.extention = file.name.substr((file.name.lastIndexOf('.') +1)).toLowerCase();
    var reader = new FileReader();  
    reader.onload = this._handleReaderLoaded.bind(this);
    reader.readAsBinaryString(fileInput.target['files'][0]);
}

    _handleReaderLoaded(readerEvt) {

        var binaryString = readerEvt.target.result;
        this.base64textString = btoa(binaryString);
        this.attached_image = 'data:image/jpeg;base64,' + this.base64textString;
        if (this.attached_image) {
            this.flashMsg = "Image uploaded successfully!";
        }
    }

请高度赞赏您的帮助。

Answer 1

可能无法一次上传多个b64文件，最简单的方法就是将数组中的图像一张一张地提交。

有一个实用工具可以实际帮助b64上传：https://www.npmjs.com/package/angular-base64-upload

如何上传多张图片和具有不同参数的单张图片

1 个答案: