Angularjs如何獲取文件擴展名？

嗨，我正在開發angularjs應用程序。我正在做文件上傳模塊。我正在嘗試驗證這些文件。我只想上傳xlsx或xls文件。我已經開發了指令和工廠方法來上傳文件，如下所示。Angularjs如何獲取文件擴展名？

myapp.directive('fileModel', ['fileUploadExcel', function (fileUploadExcel) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
      element.bind("change", function (evt) { 
       fileUploadExcel.pendingFiles[attrs.fileModel] = evt.target.files[0]; 
      }); 
     } 
    }; 
}]);

下面是我的控制器。

$scope.upload = function (filename) { 
fileUploadExcel.doUpload().success(function (success) { 
}).error(function (error) { 
});

下面是我的工廠代碼。

myapp.factory('fileUploadExcel', ['$http', '$cookieStore', 'cfg', function ($http, $cookieStore, cfg) { 
    var LoginID = $cookieStore.get("LoginID"); 
    var baseurl = cfg.Baseurl; 
    var fileuploadurl = baseurl + 'api/Customer/BulkUploadVehicle/'; 

    var service = { 
     uploadUrl: fileuploadurl, 
     pendingFiles: {}, 
     doUpload: doUpload 
    }; 
    return service; 
    function doUpload() { 
     var filename; 
     var files = new FormData(); 
     files.append('LoginID', LoginID); 
     angular.forEach(this.pendingFiles, function (value, index) { 
      filename = value.name; 
      files.append(index, value); 
     }); 
     var extn = filename.split(".").pop(); 
     if (extn == 'xlsx' || extn == 'xls') { 
      return $http.post(this.uploadUrl, files, { 
       transformRequest: angular.identity, 
       headers: { 
        'Content-Type': undefined 
       } 
      }) 
     } 
     else 
     { 
      return false; 
     } 
    } 
}]);

我能夠成功獲得extn。當我的文件是類型的Excel我的代碼工作正常。每當我上傳除Excel以外的錯誤。我寫了return false。這在這裏不起作用。我應該回到別的可能。我可否知道在其他情況下我應該寫些什麼？有人可以幫我從這裏出去嗎？任何幫助，將不勝感激。謝謝。

來源

2017-07-18 Niranjan Godbole

當您嘗試上傳除xlsx或xls擴展名以外的文件時究竟發生了什麼？它是否通過if條件？ –

謝謝拉胡爾。每當我上傳除Excel以外，我得到錯誤fileUploadExcel.doUpload（...）。成功不是一個功能 –

ahh..got it ..檢查答案？ –

你返回不同的類型：

上的成功，你返回$ http諾言在你的工廠，所以你可以打電話成功&錯誤在你的控制器whith功能：

fileUploadExcel.doUpload().success()存在！

但如果錯誤，您在工廠返回false，在這種情況下，這是一個布爾值並且不是$ http承諾，所以您不能使用成功&錯誤函數。

fileUploadExcel.doUpload().success()犯規存在，並返回一個錯誤

當然的解決辦法是檢查返回值是不假，繼續你的代碼，但我建議通過解決，它總是返回一個承諾，如果成功，拒絕它，錯誤，所以承諾鏈是一個沒有破。

PS：$ HTTP是一種改性的承諾，爲什麼他們有成功&錯誤，但我建議使用香草承諾和使用。那麼（）

var deferred = $q.defer(); 

if (extn === 'xlsx' || extn === 'xls') { 
    $http.post(this.uploadUrl, files, { 
     transformRequest: angular.identity, 
     headers: { 
      'Content-Type': undefined 
     } 
    }).success(function(success) { 
     deferred.resolve(success); 
    }).error(function(error) { 
     deferred.reject(error); 
    }); 
} else { 
    deferred.reject('File format not supported'); 
} 
return deferred.promise;

和控制器：

$scope.upload = function (filename) { 
    fileUploadExcel.doUpload().then(function (success) { 
     //success 
    }, function (error) { 
     //error 
    }); 
}

來源

2017-07-18 08:55:03 Fetrarij

謝謝你的回答。我應該在哪裏申報$ q？我得到$ q沒有定義 –

$ q應該在您的工廠注入https://docs.angularjs.org/api/ng/service/$q – Fetrarij

是的。謝謝。我不知道q。我經歷了異步調用。 –

試過這樣做呢？

$scope.upload = function (filename) { 
    var promise = fileUploadExcel.doUpload(); //gets promise object in a variable 
    if(promise){ // if variable is not false or null, handle resolution 
    promise.success(function (success) { }).error(function (error) {}); 
    } 
}

或者你可以在你的工廠返回elsenull，做一個空檢查。上面的代碼將保持不變。

來源

2017-07-18 08:37:07

當doUpload()返回false時引發錯誤。由於false是一個布爾值而不是承諾，因此不會定義.success()。

，而不是返回false的，我建議你返回一個拒絕承諾時，該文件不是一個Excel的線沿線的文件： return $q.reject("File type not supported: " + extn);

來源

2017-07-18 08:44:58

太清楚了，要做到這一點，您需要將'$ q'服務注入'fileUploadExcel'工廠，與您注入'$ http'類似。 –

Angularjs如何獲取文件擴展名？

回答

相關問題