首页 > 代码库 > angular ng-file-upload

angular ng-file-upload

传送门:https://github.com/danialfarid/ng-file-upload#install

<script src=http://www.mamicode.com/"angular(.min).js"></script>
<script src=http://www.mamicode.com/"ng-file-upload-shim(.min).js"></script> <!-- for no html5 browsers support -->
<script src=http://www.mamicode.com/"ng-file-upload(.min).js"></script>
//注入 ngFileUpload (注意:如果你用ui-load对于每个html加载文件 ,要把ng-file-upload文件放到首页去加载,不能写在ui-load里面,以免注入的时候找不到文件)
var app = angular.module(fileUpload, [ngFileUpload]);
//Upload
app.controller(MyCtrl, [$scope, Upload, function ($scope, Upload) {


// 上传方法
uploadFiles
$scope.uploadFiles = function(file, errFiles) {

var url = ‘/product/pictures/updataPicture.do‘; //接口名

$scope.f = file;
$scope.errFile = errFiles && errFiles[0];
if (file) {
file.upload = Upload.upload({
url: url,
data: {uploadFileName: file, ‘prodId‘: $scope.prodId, ‘prictureGroup‘: $scope.prictureGroup ,‘sortOrder‘ : $scope.sortOrder}//参数对应
});

file.upload.then(function (res) {
// 上传成功时操作
}, function (response) {
// if (response.status > 0)
// $scope.errorMsg = response.status + ‘: ‘ + response.data;
}, function (evt) {
// file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
});
}
};

}]);

html

<button type="file" ngf-select="uploadFiles($file, $invalidFiles)" accept="image/*" ngf-max-height="1000" ngf-max-size="1MB"></button>
<img src=http://www.mamicode.com/"{{上传成功后接口返回图片url}}" alt="">

 

angular ng-file-upload