簡體   English   中英

Angular Ng2-file-Upload Upload.all() 沒有上傳文件到 API

[英]Angular Ng2-file-Upload Upload.all() not uploading file to API

我正在嘗試上傳文件 mp4 和 jpg 擴展名,我有 2 個單獨的 Fileuploader 實例,對 2 個單獨的 FileUploader 施加了一些自定義驗證,我有一個上傳按鈕,上傳按鈕的 onclick 正在將 2 個 FileUploader 中的文件推送到單個 FileUploader 並調用內置方法 upload all 將文件上傳到服務器,但它沒有訪問服務器(API 服務),我特此將代碼粘貼到我嘗試過的代碼下方,請幫助我解決此問題。

文件上傳器初始化

    uploader: FileUploader;
    coverImageUploader: FileUploader;
    mergedFileUploader: FileUploader;
    options: FileUploaderOptions = {
        url: URL,
        authToken: `Bearer Token`,
        authTokenHeader: 'authorization',
        isHTML5: true,
        method: 'POST',
        itemAlias: 'file',
        headers: [{
            name: 'refId',
            value: ''
        }, {
            name: 'userId',
            value: ''
        }, {
            name: 'roleId',
            value: ''
        }]
    }

        this.uploader = new FileUploader(this.options);
        this.coverImageUploader = new FileUploader(this.options);
        this.mergedFileUploader = new FileUploader(this.options);
 

將尚未上傳的文件從 2 FileUploader 推送到另一個 FileUploader

      let files: any = []  
      files.push(this.uploader.getNotUploadedItems().filter((f: FileItem) => !f.isUploading))  
      files.push(this.coverImageUploader.getNotUploadedItems().filter((f: FileItem) => 
      !f.isUploading)) 

var merged = [].concat.apply([], files);
        merged.forEach(e => {
            e.options.headers.find((o, i) => {
                            if (o.name === 'refId') {
                    e.options.headers[i] = {
                        name: 'refId',
                        value: e.formData.reduce(r => r).RefId

                    };
                    return true;
                } else if (o.name === 'userId') {
                    e.options.headers[i] = {
                        name: 'userId',
                        value: user.userId.toString()
                    };
                    return true; 
                } else if (o.name === 'roleId') {
                    e.options.headers[i] = {
                        name: 'userId',
                        value: user.roleId.toString()
                    };
                    return true; 
                }
            })
        })
        this.uploader.clearQueue();
        this.coverImageUploader.clearQueue();
        this.mergedFileUploader.clearQueue()
        this.isUploadProcessing = true
        this.mergedFileUploader.addToQueue(files)

上傳按鈕點擊事件方法

UploadFiles(){
this.mergedFileUploader.uploadAll()
}

無法獲得很多文件上傳器部分,盡管在 javascript 中使用簡單的 FileReader 來實現類似的功能可能值得一試(讀取文件內容,然后使用 http 客戶端服務進行所需的服務器調用)。 看這里:

https://javascript.info/file

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM