AngularJS yineleme ve form doğrulaması

Question

AngularJS'de form doğrulaması ile ilgili bir sorun yaşıyorum ve formdaki öğelerin ng tekrarını kullanıyorum.

HTML:

<div ng-app> 
    <div ng-controller="EditController"> 
     <form name="form" novalidate>Name: 
      <br/> 
      <input type="text" ng-model="model.name" required="" /> 
      <hr />Products: 
      <br/> 
      <div ng-repeat="product in model.products"> 
       <div> 
        <input type="text" ng-model="product.name" required="" /> 
        <input type="text" ng-model="product.price" required="" /> <a href="javascript:void(0)" ng-click="remove($index)">Remove</a> 

       </div> 
      </div> 
      <hr /> 
      <button ng-disabled="form.$invalid || !form.$dirty" ng-click="save()">save</button> 
      <div ng-show="form.$invalid && !form.$pristine">There are errors.</div> 
      <div ng-show="!form.$dirty && form.$pristine">No changed detected to be saved.</div> 
      <div> 
       <p>Dirty? {{form.$dirty}}</p> 
       <p>Invalid? {{form.$invalid}}</p> 
       <p>Pristine? {{form.$pristine}}</p> 
      </div> 
     </form> 
    </div> 
</div> 

JS:

function EditController($scope) { 
    $scope.model = { 
     name: "Phil", 
     products: [{ 
      name: "Foo", 
      price: 12.99 
     }, { 
      name: "Bar", 
      price: 15.99 
     }, { 
      name: "FooBar", 
      price: 24.99 
     }] 
    }; 

    $scope.remove = function(index){ 
     $scope.model.products.splice(index, 1); 
    }; 

    $scope.save = function() { 
     console.log("saved"); 
    }; 
} 

Fiddle:

http://jsfiddle.net/66V6m/2/

Çoğalt:

rem tıklayarak 1 öğe kaldırma ove, form kirlenmez, bu nedenle düğme etkinleştirilmez.

Ad alanını düzenlerseniz, form kirlenir.

Bir öğeyi diziden nasıl kaldırılacağına dair herhangi bir fikir formu kirli yapar?

Answer 1

Eğik burada başarmak için çalışıyoruz sadece amaçla bir $setDirty() fonksiyonu sağlar. Basitçe böylece

<input type="text" ng-model="product.price" required="" /> 
<a href="javascript:void(0)" ng-click="remove($index); form.$setDirty(true);">Remove</a> 

sevdiği ng-click Özellikte o eklemek Ben senin keman çatallı ettik ve belki bu açıklama size yardımcı olacaktır here

Answer 2

İşte bir yol.

$scope.remove = function (index) { 
    $scope.model.products.splice(index, 1); 
    $scope.form.$dirty = true; 
};