angularjs 文件上传ng-file-upload插件使用

最新推荐文章于 2022-10-17 12:04:39 发布

三致

最新推荐文章于 2022-10-17 12:04:39 发布

阅读量2.7k

点赞数

分类专栏： web前端文章标签： angularjs 插件

本文链接：https://blog.csdn.net/lbbknight/article/details/73648209

版权

web前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1需要引入依赖 angular-file-upload.js ， angular-loader.min.js， ng-file-upload-shim.min.js

2前端代码：$scope.upload = function() {
    var insuranceCompanyId = $scope.importInsuranceCompany;
    var importState = $scope.importFile_importState;
    var dateRange = $scope.importdates;
    var userId = oauthService.getLocalUserId();
    var userName = oauthService.getLocalUserName();
    var file = $scope.files;
    var confirmUpload = "";
    if(insuranceCompanyId == null || insuranceCompanyId <1){

        confirmUpload = "请选择保险公司！";
    }
    if (!file) {
        if(confirmUpload){
            confirmUpload += "\n";
        }
        confirmUpload += "请选择要上传的文件！";
    }
    if(confirmUpload){
        alert(confirmUpload);
        return;
    }
    for(var i=0;i<file.length;i++){
        Upload.upload({
            url: getBackendApiUrl("claimResult/import/file"),
            data: {file: file[i], 'importState':importState,'insuranceCompanyId':insuranceCompanyId,'userId':userId,'userName':userName,'dateRange':dateRange,'filecount':i+"-"+file.length}
        }).then(function(){
            // $scope.getUploadFiles();
        });
    }
};
3.html页面
<tr><td>
    <input name="uploadFile" type="file" multiple="true" ng-model="files" accept="application/msexcel" ngf-select="uploadFile($file)">
</td></tr>
<tr><td>
    <button type="button" class="btn btn-success" data-dismiss="modal" ng-click="upload()">
        <i class="fa fa-upload" aria-hidden="true"></i>&nbsp;&nbsp;&nbsp;上传&nbsp;&nbsp;&nbsp;&nbsp;
    </button>