angular file upload 怎么传前台动态数据?求大神指路,谢谢了

lzzzzzzzzzzza 2017-12-19 01:40:30
var uploader = $scope.uploader = new FileUploader({
url:'http://192.168.8.101:10080/web30/oauth/api/v2/equipment/readFrossmCsv',
method: "POST"
});
获取到页面的数据
$ctrl.workShopId=angular.element("#selectedId").val();


我怎么把动态数据和文件一起上传,求大神指路。
...全文
690 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
pidanlove 2018-01-05
  • 打赏
  • 举报
回复
                               
 <input type="file" name="picType1" nv-file-select="" uploader="uploader" ng-click="clearItems(1,0)"/>浏览
<button type="button" ng-click="UploadFile()">提交</button>

$scope.CasePic = null;
    var uploader = $scope.uploader = new FileUploader({
        url: 'upload/caseFile',
        queueLimit: 1,     //文件个数
        removeAfterUpload: true   //上传后删除文件
    });
    $scope.clearItems = function(type,classification){    //重新选择文件时,清空队列,达到覆盖文件的效果
        uploader.clearQueue();
        //动态赋值
        $scope.CasePic = {caseInfoId:$scope.Model.id,type:type,classification:classification};
    }
    
    //向队列中添加一个单独的文件后触发
    uploader.onAfterAddingFile = function(fileItem) {
        fileItem.formData = [$scope.CasePic];//数据放到这里。 当文件被添加到队列时,来自FileUpload的设置被复制到FileItem。因此,FileUpload在将文件添加到队列后对选项所做的任何更改都将不起作用
        $scope.fileItem = fileItem._file;    //添加文件之后,把文件信息赋给scope
        //能够在这里判断添加的文件名后缀和文件大小是否满足需求。
    };
    //一个文件上传成功后触发
    uploader.onSuccessItem = function(fileItem, response, status, headers) {
        if(response.success){
            ngNotify.set('上传图片成功', 'success');
            $scope.findById();
        }
    };
    //上传出错时触发
    uploader.onErrorItem = function(fileItem, response, status, headers) {
        console.info('onErrorItem', fileItem, response, status, headers);
    };
    $scope.UploadFile = function(){
        uploader.uploadAll();
    }

    @RequestMapping(value = "/caseFile", method = RequestMethod.POST)
    public JsonResult uploadImg(@RequestParam("file")MultipartFile file,CasePic casePic) throws IOException{}

    /**
     *  上传文件
     * */
    public JsonResult uploadFile(MultipartFile file, String fileDirPath) throws IOException{
        if(!file.isEmpty()){
            String fileName = file.getOriginalFilename();
            String extensionName = StringUtils.substringAfter(fileName,".");
            //生成新的guid的文件名
            String newFileName = UUID.randomUUID()+ "."+extensionName;
            FileUtils.createDirectory(FileUtils.path(fileDirPath));
            Path filePath = Paths.get(fileDirPath, newFileName);
            //保存到响应的路径下
            Files.copy(file.getInputStream(), filePath);

            UploadResult uploadResult = new UploadResult();
            uploadResult.setSrc(newFileName);
            uploadResult.setName(fileName);

            return JsonResult.success(uploadResult);
        }else{
            return JsonResult.fail("无文件");
        }
    }
}

39,083

社区成员

发帖
与我相关
我的任务
社区描述
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
社区管理员
  • HTML5社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧