2017-05-10 16 views
0

は公開:angularjs明確なフォーム入力タイプのファイル

$scope.product = {}; 
 
     $scope.upload = function(user) { 
 
      var formData = new FormData; 
 
      $scope.product.owner = user; 
 

 
      for (key in $scope.product) { 
 
       formData.append(key, $scope.product[key]); 
 
       //console.log(key, "........."); 
 
       //console.log($scope.product[key]); 
 
      }; 
 

 
      //getting the file 
 
      var file = $('#file')[0].files[0]; 
 
      formData.append('image', file); 
 

 
      $http.post('http://localhost:3000/products', formData, { 
 
       transformRequest: angular.identity, 
 
       headers: { 
 
        'Content-Type': undefined 
 
       } 
 
      }).then(function(res) { 
 
       $scope.item = res.data; 
 
       console.log($scope.item.image); 
 
       products.displayuserlist.push({ 
 
        owner: $scope.product.owner, 
 
        car: $scope.product.newCar, 
 
        //seaters: 5, 
 
        price: $scope.product.newPrice, 
 
        //contact: 38880000, 
 
        area: $scope.product.businessArea, 
 
        image: $scope.item.image 
 
       }); 
 
       $scope.product = null; 
 
      }); 
 

 
     };

すべての入力フィルは除い明らかにされている

<form ng-submit="upload(currentUser())"> 
 
        <div class="row"> 
 
         <div class="form-group"> 
 
          <div class="col-xs-2"> 
 
           <label>Car</label> 
 
          </div> 
 
          <div class="col-xs-5"> 
 
           <input type="text" placeholder="Perodua Myvi" class="form-control" ng-model="product.newCar" required> 
 
          </div> 
 
          <div class="col-xs-5"></div> 
 
         </div> 
 
        </div> 
 
        <div class="row"> 
 
         <div class="form-group"> 
 
          <div class="col-xs-2"> 
 
           <label>Price(RM) per day</label> 
 
          </div> 
 
          <div class="col-xs-5"> 
 
           <input type="text" placeholder="80" class="form-control" ng-model="product.newPrice" required> 
 
          </div> 
 
          <div class="col-xs-5"></div> 
 
         </div> 
 
        </div> 
 
        <div class="row"> 
 
         <div class="form-group"> 
 
          <div class="col-xs-2"> 
 
           <label>Business Area</label> 
 
          </div> 
 
          <div class="col-xs-5"> 
 
           <input type="text" placeholder="Universiti Malaysia Sabah" class="form-control" ng-model="product.businessArea" required> 
 
          </div> 
 
          <div class="col-xs-5"></div> 
 
         </div> 
 
        </div> 
 
        <div class="row"> 
 
         <div class="form-group"> 
 
          <div class="col-xs-2"> 
 
           <label>Insert Car Image</label> 
 
           <br> 
 
          </div> 
 
          <div class="col-xs-5"> 
 
           <!--<button type="button" class="btn btn-default btn-sm"> 
 
            <span class="glyphicon glyphicon-picture"></span> Image 
 
           </button>--> 
 
           <input type="file" id="file" ng-model="product.postimage" /> 
 
          </div> 
 
          <div class="col-xs-5"></div> 
 
         </div> 
 
        </div> 
 
        <div class="row"> 
 
         <div class="form-group"> 
 
          <div class="col-xs-2"> 
 
          </div> 
 
          <div class="col-xs-5"> 
 
           <button type="submit" class="btn btn-primary btn-sm pull-right"> 
 
            <span class="glyphicon glyphicon-globe"></span> Publish 
 
           </button> 
 
          </div> 
 
          <div class="col-xs-5"></div> 
 
         </div> 
 
        </div> 
 
        <br> 
 
        <br> 
 
       </form>

私はangle.element( "input [type = 'file']")を使用しようとしました。 $ setPristine()は動作しません。これはどうすればいいですか?

答えて

0

あなたはこの

$scope.product.postimage = null; 
$('#file').val(''); 
を試すことができます
関連する問題