2

これは私のhtmlコードです:

<input type="file" nv-file-select="" options="{ photoType: 'studentPic' }" uploader="uploader" />

これは角度コードです:

var uploader = $scope.uploader = new FileUploader({
            url: 'badges/photos',
            autoUpload: true
        });

        // FILTERS

        uploader.filters.push({
            name: 'customFilter',
            fn: function (item /*{File|FileLikeObject}*/ , options) {                
                return this.queue.length < 10;
            }
        });

        // CALLBACKS

        uploader.onWhenAddingFileFailed = function (item /*{File|FileLikeObject}*/ , filter, options) {
            console.info('onWhenAddingFileFailed', item, filter, options);
        };
        uploader.onAfterAddingFile = function (fileItem) {
            console.info('onAfterAddingFile', fileItem);
        };
        uploader.onAfterAddingAll = function (addedFileItems) {
            console.info('onAfterAddingAll', addedFileItems);
        };
        uploader.onBeforeUploadItem = function (item) {
            console.log("item before uploading:",item._file.type);
            console.log("item before uploading:",item._file.size);
            if((item._file.type!="image/png" && item._file.type!="image/jpeg") || item._file.size>102400){
                console.log("in if of before");
                this.cancelItem(item);
            }            
            console.log(item.photoType);
            var filename = generateUUID();
            if (item.photoType === 'studentPic') {
                $scope.pic = filename;
            }
            if (item.photoType === 'pickupPerson1Pic') {
                $scope.pickupPerson1Pic = filename;
            }
            if (item.photoType === 'pickupPerson2Pic') {
                $scope.pickupPerson2Pic= filename;
            }
            item.formData.push({
                filename: filename
            });
            console.info('onBeforeUploadItem', item);
        };
        uploader.onProgressItem = function (fileItem, progress) {
            console.info('onProgressItem', fileItem, progress);
        };
        uploader.onProgressAll = function (progress) {
            console.info('onProgressAll', progress);
        };
        uploader.onSuccessItem = function (fileItem, response, status, headers) {
            if (fileItem.photoType === 'studentPic') {
                angular.element('#picPreview').attr("src", response.url);
            }
            if (fileItem.photoType === 'pickupPerson1Pic') {
                angular.element('#pickupPerson1PicPreview').attr("src", response.url);
            }
            if (fileItem.photoType === 'pickupPerson2Pic') {
                angular.element('#pickupPerson2PicPreview').attr("src", response.url);
            }
            console.info('onSuccessItem', fileItem, response, status, headers);
        };
        uploader.onErrorItem = function (fileItem, response, status, headers) {
            console.info('onErrorItem', fileItem, response, status, headers);
        };
        uploader.onCancelItem = function (fileItem, response, status, headers) {
            console.info('onCancelItem', fileItem, response, status, headers);
        };
        uploader.onCompleteItem = function (fileItem, response, status, headers) {
            console.info('onCompleteItem', fileItem, response, status, headers);
        };
        uploader.onCompleteAll = function () {
            console.info('onCompleteAll');
        };

私の uploader.onBeforeUploadItem には if((item._file.type!="image/png" && item._file.type!="image/jpeg") || item._file.size>102400) という条件があり、それが成功した場合this.cancelItem(item) メソッドを呼び出します。

 uploader.onBeforeUploadItem = function (item) {
                console.log("item before uploading:",item._file.type);
                console.log("item before uploading:",item._file.size);
                if((item._file.type!="image/png" && item._file.type!="image/jpeg") || item._file.size>102400){
                    console.log("in if of before");
                    this.cancelItem(item);
                }            
                console.log(item.photoType);
                var filename = generateUUID();
                if (item.photoType === 'studentPic') {
                    $scope.pic = filename;
                }
                if (item.photoType === 'pickupPerson1Pic') {
                    $scope.pickupPerson1Pic = filename;
                }
                if (item.photoType === 'pickupPerson2Pic') {
                    $scope.pickupPerson2Pic= filename;
                }
                item.formData.push({
                    filename: filename
                });
                console.info('onBeforeUploadItem', item);
            };

今、cancel Item メソッドを間違って呼び出していますか? 条件が一致しているにもかかわらず、アイテムのアップロードは引き続き正常に行われるためです。助けてください

4

1 に答える 1

0

this.cancelItem(item) は、すでに進行中のアップロードをキャンセルします。

ファイルをアップロードする前に、条件を確認する必要があります。

たとえば、次のようになります。

<button type="button" id="upLoadFileButton" data-ng-click="validateStuffBeforeUpload(item)">Upload File</button>

そして、コントローラーには、検証したいものを検証する関数があり、成功したら、uploadItem メソッドを呼び出してファイル項目を渡します。

    $scope.validateStuffBeforeUpload = function (fileItem) {
            if((item._file.type!="image/png" && item._file.type!="image/jpeg") || item._file.size>102400){
                console.log("in if of before");
            } else {
                uploader.uploadItem(fileItem);
            }
        };

または、そのバリエーション... いずれにせよ、uploadItem メソッドを呼び出す前に、必要なものを検証する必要があります。

于 2015-07-22T07:08:38.033 に答える