角JS文件上传 - 限制文件类型，大小

Question

因为我使用以下模块文件上传： https://github.com/nervgh/angular-file-upload

HTML片段是这样的：

<div nv-file-drop="" uploader="uploader" options="{ url: '/whatever/uploadfile'}" 
    removeAfterUpload="true" > 
    <div nv-file-over="" uploader="uploader" over-class="another-file-over-class" 
class="well my-drop-zone" > 
    You may drag drop files here 
    </div> 
    </div> 

哪有我保证：
- 只有图像（PNG/JPG）可以放在文件放置区？
- 文件大小是有限的。

显然可以使用过滤器 - 但找不到任何示例。

Answer 1

Checkout如何过滤器被用于一些实施例的源代码上（https://github.com/nervgh/angular-file-upload/blob/master/src/module.js#L51）

this.filters.unshift({name: 'queueLimit', fn: this._queueLimitFilter}); 
this.filters.unshift({name: 'folder', fn: this._folderFilter}); 

队列限制滤波器（https://github.com/nervgh/angular-file-upload/blob/master/src/module.js#L357）

FileUploader.prototype._queueLimitFilter = function() { 
    return this.queue.length < this.queueLimit; 
}; 

文件夹筛选（https://github.com/nervgh/angular-file-upload/blob/master/src/module.js#L349）

FileUploader.prototype._folderFilter = function(item) { 
    return !!(item.size || item.type); 
}; 

基于那些例子mples我想滤波器可以用作例如：

的javascript

var uploadOptions = { 
    url: '/whatever/uploadfile', 
    filters: [] 
}; 

// File must be jpeg or png 
uploadOptions.filters.push({ name: 'imagefilter', fn: function(item) { 
    return item.type == 'image/jpeg' || item.type == 'image/png'; 
}}); 

// File must not be larger then some size 
uploadOptions.filters.push({ name: 'sizeFilter', fn: function(item) { 
    return item.size < 10000; 
}}); 

$scope.uploadOptions = uploadOptions; 

HTML

<div nv-file-drop="" uploader="uploader" options="uploadOptions" removeAfterUpload="true" > 
    <div nv-file-over="" uploader="uploader" over-class="another-file-over-class" class="well my-drop-zone" > 
    You may drag drop files here 
    </div> 
</div>