作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我的 html 文件:Upload.html
<tr ng-repeat="expenses in finalJson.comments">
<td >
<div class="image-upload">
<label for="file-input">
<img src="../images/upload1.jpg" style="width: 20px;"/>{{data.files[0].name}}
</label>
<input id="file-input" type="file" ng-model="expenses.files" ngf-select accept="*" value=""/>
</div>
</td>
</tr>
[{
"index": 1,
"amount": "10",
"$$hashKey": "object:5",
"date": "2016-04-11",
"Category": "58",
"note": "wdxw",
"paid_to": "swdw",
"files": {
"webkitRelativePath": "",
"lastModified": 1450934331000,
"lastModifiedDate": "2015-12-24T05:18:51.000Z",
"name": "node-js.pdf",
"type": "application/pdf",
"size": 182649
}
}, {
"$$hashKey": "object:31",
"date": "2016-04-05",
"Category": "60",
"note": "scds",
"paid_to": "dsad",
"amount": "20"
}]
最佳答案
在 ng-repeat 中使用此代码
html代码:
<div ng-controller = "myCtrl">
<div ng-repeat="fileInput in fileInputs">
<input type="file" file-model="{{'myFile' + $index}}"/>
<button ng-click="uploadFile('myFile' + $index)">upload me</button>
</div>
</div>
var myApp = angular.module('myApp', []);
myApp.directive('fileModel', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
var model, modelSetter;
attrs.$observe('fileModel', function(fileModel){
model = $parse(attrs.fileModel);
modelSetter = model.assign;
});
element.bind('change', function(){
scope.$apply(function(){
modelSetter(scope.$parent, element[0].files[0]);
});
});
}
};
}]);
myApp.service('fileUpload', ['$http', function ($http) {
this.uploadFileToUrl = function(file, uploadUrl){
var fd = new FormData();
fd.append('file', file);
$http.post(uploadUrl, fd, {
transformRequest: angular.identity,
headers: {'Content-Type': undefined}
})
.success(function(){
})
.error(function(){
});
}
}]);
myApp.controller('myCtrl', ['$scope', 'fileUpload', function($scope, fileUpload){
$scope.fileInputs = [1,2,3];
$scope.uploadFile = function(filename){
var file = $scope[filename];
console.log('file is ' + JSON.stringify(file));
console.dir(file);
var uploadUrl = "http://httpbin.org/post";
fileUpload.uploadFileToUrl(file, uploadUrl);
};
}]);
关于angularjs - 在 ng-repeat 中上传 Angular-js 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36469003/
我有以下正则表达式 /[a-zA-Z0-9_-]/ 当字符串只包含从 a 到z 大小写、数字、_ 和 -。 我的代码有什么问题? 能否请您向我提供一个简短的解释和有关如何修复它的代码示例? //var
我是一名优秀的程序员,十分优秀!