如何在angularJS中检测上传的文件类型

问题描述

我有一个使用angularJS仅上传图像文件的表单.上载文件一切正常.问题是，我想将上传的文件限制为仅图像文件，并且图像的大小必须限制为MB.如何仅使用angularJS实现此目的?下面是代码

I have an form to upload only image file using angularJS. Uploading the file is all working fine. The problem is, I want to restrict the uploaded file to be only image file and also the size of the image to be some MB. How can I achieve this using only angularJS? Below is the code

$scope.uploadFile = function(files) {
    var fd = new FormData();
    //Take the first selected file
    fd.append("file", files[0]);

    $http.post("logoTypesServiceStore", fd, {
        withCredentials: true,
        headers: {'Content-Type': undefined },
        transformRequest: angular.identity
    }).success( function(data) {alert(data); }).error( function(data) { alert(data)});

};

下面是上传文件的表单.

Below is the form to upload file.

 <form name="logoTypeForm" novalidate>
     <input type="text" name="logoType" ng-model="logoType" class="form-control" required />
     <input type="file" name="file" onchange="angular.element(this).scope().uploadFile(this.files)"/>

 </form>

推荐答案

现代浏览器具有文件API 支持./p>

Modern browsers have File API support.

$scope.uploadFile = function(files) {
    files[0].type; //MIME type
    files[0].size; //File size in bytes
};

此处是图像MIME类型的列表

Here is a list of image MIME types

这篇关于如何在angularJS中检测上传的文件类型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！