您的位置：首页 > Web前端 > AngularJS

angular input file 上传文件

2016-05-05 22:57 886 查看

<body >
<div ng-controller="fileCtrl">
<form ng-submit="submit(obj)">
<input type="file" ng-file-model="obj.testFile" />
<input type="submit"  value="submit" />
</form>
Submitted File :
<pre>

</pre>
</div>
<script>
angular.module("myApp", [])
.controller("fileCtrl",["$scope", function($scope){
$scope.submittedFile = {};
$scope.obj = {};
$scope.submit = function(obj){
console.log(JSON.stringify(obj.testFile))

}
}])

.directive("ngFileModel", [function () {
return {
scope: {
ngFileModel: "="
},
link: function (scope, element, attributes) {
element.bind("change", function (changeEvent) {
var reader = new FileReader();
reader.onload = function (loadEvent) {
scope.$apply(function () {
scope.ngFileModel = {
lastModified: changeEvent.target.files[0].lastModified,
lastModifiedDate: changeEvent.target.files[0].lastModifiedDate,
name: changeEvent.target.files[0].name,
size: changeEvent.target.files[0].size,
type: changeEvent.target.files[0].type,
data: loadEvent.target.result
};
});
}
reader.readAsDataURL(changeEvent.target.files[0]);
});
}
}
}]);
</script>
</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航