0

I'm really new to AngularJS and I've found that ng-model doesn't work for a file type input tag. I want to be able to allow users to upload pictures to my app, but nothing I've tried so far has worked. I've tried to use both ng-file upload and angular-file upload, but they both require dependency injection and whenever I try that my entire app crashes. I've been reading that a new directive can be created, but I am so new to Angular that I'm not understanding how to do that. Any insight would be great!

postImage.html :

<div id="postimage container" >
<div >
    <input type="file" name="image" np-model="$ctrl.image"/>
    <button ng-click="$ctrl.upload($ctrl.image)">Upload</button> 
</div>

postimage.js :

angular.module('main')

.component('postimage', {
  controller: function () {
    this.upload = function (data) {
     console.log(data)
    }
  },
  templateUrl: '../templates/postImage.html'
});
Spencer Attick
  • 36
  • 6
  • There're several solutions to this on SO already. Please google for them. https://stackoverflow.com/questions/31665305/angularjs-upload-and-display-image-using-filereader-api-multiple-files – codemax Aug 17 '17 at 01:48
  • I've been googling all day and am really not understanding any of the solutions I've found. =/ – Spencer Attick Aug 17 '17 at 02:01
  • First, read the solution in the link. And try to implement it for your use case. Once you can get it working, maybe you can try to make it more advanced. – codemax Aug 17 '17 at 02:05

0 Answers0