angularJS file-up-load上传图片

前端之家收集整理的这篇文章主要介绍了angularJS file-up-load上传图片前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

<div class="form-group">
<label class="col-xs-2 control-label col-xs-offset-1">系统图片</label>
<div class="col-xs-7">
<div class="input-group" ng-show="YES">

<input class="file-name form-control" type="text" readonly="readonly" id="fileItem" value="`fileItem`.`name`" ng-model="fileItem.name"/>
<div class="input-group-btn">
<input type="file" accept="image/*" file-model="myFile" name="certificate" class='input-file files fff' id="f" onchange="txt.value=this.value" size="1" hidefocus nv-file-select uploader="uploader"/>
<input type="button" onmousemove="f.style.pixelLeft=event.x-60;f.style.pixelTop=this.offsetTop;" value="选择图片" size="30" onclick="f.click()" class=" btn-info btn liulan">
</div>
</div>
<div class="input-group" ng-show="NO">
<div class="input-group-btn">
<input class="form-control" readonly type="text" name="branchPn_add" name="sysImagePc_add" value="`sysImagePc_add`" ng-model="sysImagePc_add" style="width: 82%;">
<input type="button" value="重新选择" ng-click="chooseAgain()" size="30" class=" btn-info btn liulan">
</div>
</div>

<div class="input-group imgSrc" ng-show="YESs">
<img ng-src="`imageSrc`" id="iSrc" style="max-width:434px;max-height:300px;margin:0 auto;display:block;" />
</div>
<br />
<a class="btn btn-info" ng-click='UploadFile()'>上传</a>
<a class="btn btn-default" ng-click="EditloadFile()">取消</a>
</div>



</div>


//新增系统-开始出现弹窗 $scope.addSystem = function(){ $scope.YESs = t2; $scope.YES = t1; $scope.NO = t2; $scope.imageSrc = ""; $('#fileItem').val("");// $scope.createUser_add = $scope.LoginList.employeeName } //新增系统-重新选择 $scope.chooseAgain = function(){ $scope.YES = t1; $scope.YESs = t2; $scope.NO = t2; $scope.fileItem = null; $scope.imageSrc = false; } //新增系统-上传图片预览 $scope.getFile = function () { fileReader.readAsDataUrl($scope.file,$scope) .then(function(result) { $scope.sysImagePc_edit = result; $scope.YESs = t1; $scope.sysImagePc_edit = result; $scope.imageSrc = result; $scope.fileItem = $scope.file; }); }; //新增系统-点击上传 $scope.uploadStatus = false; var uploader = $scope.uploader = new FileUploader({ url: '/FileServlet',queueLimit: 1,removeAfterUpload: true }); uploader.onAfterAddingFile = function(fileItem) { $scope.fileItem = fileItem._file; }; uploader.onSuccessItem = function(fileItem,response,status,headers) { $scope.uploadStatus = true; $scope.sysImagePc_add = response; $scope.sysImagePc_edit = response; $scope.YESs = t2; $scope.YES = t2; $scope.NO = t1; }; $scope.UploadFile = function(){ uploader.uploadAll(); }; //新增产品-选择图片--取消 $scope.EditloadFile = function(){ $scope.YES = t1; $scope.YESs = t2; $scope.NO = t2; $('#fileItem').val(""); $scope.fileItem = $scope.sysImagePc_edit; };

猜你在找的Angularjs相关文章