Reputation: 149
I need to upload multiple images in a div , i try the below
angular code :
$scope.stepsModel = [];
$scope.imageUpload = function(element){
var reader = new FileReader();
reader.onload = $scope.imageIsLoaded;
reader.readAsDataURL(element.files);
}
$scope.imageIsLoaded = function(e){
$scope.$apply(function() {
$scope.stepsModel.push(e.target.result);
});
}
html code :
<input type="file" ng-model-instant name="myImage" accept="image/*" onchange="angular.element(this).scope().imageUpload(event)"/>
I got this error :
Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.
at b.$scope.imageUpload (new_ads.js:34)
at HTMLInputElement.onchange (new_ads:202)
I saw some links here ,that all for single image uploading , i need to upload multiple image one by one to a div .
Can anybody help me thanks a lot in advance .
Upvotes: 0
Views: 5294
Reputation: 4876
Your code require 2 changes
$scope.imageUpload = function(element){
var reader = new FileReader();
reader.onload = $scope.imageIsLoaded;
//console.log(element.target.files[0])
reader.readAsDataURL(element.target.files[0]);
}
See this fiddle http://jsfiddle.net/ADukg/9867/
Upvotes: 1