2017-05-19 13 views
0

ここに私のコントローラファイル内の各入力要素(名前、価格、日付、画像)の値を取得し、オブジェクトの配列にプッシュすると仮定しているコードがあります...ファイルアップロードがAngularJSで機能しない

$scope.addBook = function(name, price, date, image) { 

     name = $scope.name; 
     price = $scope.price; 
     date = $scope.date; 
     image = $scope.image; 

     $scope.products.push({ 
      name: name, 
      price: price, 
      pubdate: date, 
      cover: image, 
      likes: 0, 
      dislikes: 0 
     }); 


     }; 

これは

 <form> 


     <input id="name" ng-model="name" type="text" placeholder="Book Title"> 
     <input id="price" ng-model="price" type="text" placeholder="Enter Book Price"> 
     <input id="date" ng-model="date" type="date" placeholder="Publication Date"> 

     <input type="file" ng-model="image"/> 

     <input ng-click="addBook()" type="submit" value="Submit"> 
     <form> 

私は、コードが動作しない理由はわからないんだけど、私は私のindex.htmlの中に持っているものです。私はaddBook()関数が実行されたときにエラーや何かを得ることはありません。ここで

答えて

0

はNG-ファイル・アップロードが

<!--Upload on form submit or button click--> 
<form ng-app="fileUpload" ng-controller="MyCtrl" name="form"> 
    Single Image with validations 
    <div class="button" ngf-select ng-model="file" name="file" ngf-pattern="'image/*'" 
    ngf-accept="'image/*'" ngf-max-size="20MB" ngf-min-height="100" 
    ngf-resize="{width: 100, height: 100}">Select</div> 
    <button type="submit" ng-click="submit()">submit</button> 
</form> 

をどのように動作するかであるコントローラー

app.controller('MyCtrl', ['$scope', 'Upload', function ($scope, Upload) { 
    // upload later on form submit or something similar 
    $scope.submit = function() { 
     if ($scope.form.file.$valid && $scope.file) { 
      $scope.upload($scope.file); 
     } 
    }; 
    $scope.upload = function (file) { 
     Upload.upload({ 
      url: 'upload/url', 
      data: {file: file, 'username': $scope.username} 
     }).then(function (resp) { 
      console.log('Success ' + resp.config.data.file.name + 'uploaded. 
      Response: ' + resp.data); 
     }, function (resp) { 
      console.log('Error status: ' + resp.status); 
     }, function (evt) { 
      var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
      console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name); 
     }); 
    }; 
}]); 

documentation

+0

を見てみることに感謝! –

関連する問題