ng-Modell, die ng-Änderung nicht aktualisiert von ng-Klick

Question

AKTUALISIERT

Ich denke

ng-init="currentQuantity=item.quantity" 

verwendet einfach verhindert das ng-Modell currentQuantity aus, um zum nächsten erhöhten Wert zu aktualisieren. Gibt es in dem folgenden Beispiel Problemumgehungen?

Kann ich zum Beispiel gezielt ein currentQuantity Modell von Index so weiß ich, welches Modell ich bin zu ändern und nicht alle auf einmal von ihnen?

---

Ich habe zur Zeit Probleme mit AngularJS. Durch den Code unter i Produkte in einen Warenkorb Array bin Zusatz:

QuantityChanged(product, currentQuantity); 

Weiter habe ich eine + Taste neben diesem Eingabefeld, das ein von der Menge des Produkts kommt noch hinzu, in den Warenkorb gelegt.

<button class="plus-button" ng-click="addToCart(product);">+</button> 

Mein ng-Modell = "currentQuantity" jedoch nur aktualisiert, wenn QuantityChanged (Produkt, currentQuantity) verwenden, aber nicht, wenn ich bin mit dem ng-Klick = "addToCart (Produkt)" Funktion.

Wenn ich in meinem lokalen Speicher schaue, sehe ich, dass die Menge des Wagens erfolgreich aktualisiert wird, aber wenn ich den aktuellen Eingabetextfeldwert des ng-Modells ansehe: currentQuantity ich sehe nichts geändert. Wenn ich auffrische, sehe ich den korrekten Wert im Eingabefeld. Fehle ich etwas Offensichtliches?

Ausblick:

<span ng-repeat="item in cart"> 
     <span ng-if="item.id === product.id"> 
      <input type="text" ng-change="QuantityChanged(product, currentQuantity);" ng-model="currentQuantity" ng-init="currentQuantity=item.quantity" class="product-aantal" /> 
     </span> 
</span> 

<button class="plus-button" ng-click="addToCart(product);">+</button> 

Einiger Controller-Code (falls erforderlich):

$scope.QuantityChanged = function (product, quantity) { 

     quantity = parseFloat(quantity, 6); 

     $scope.cart.forEach(function (item) { 
      if (item.id === product.id) { 

       if(item.quantity < quantity){ 
        $scope.productCounter = $scope.productCounter + (quantity - item.quantity); 
       } 
       if(item.quantity > quantity){ 
        $scope.productCounter = $scope.productCounter - (item.quantity - quantity); 
       } 

       item.quantity = quantity; 
       item.totalprice = parseFloat(item.price,6) * quantity; 
      } 
     }); 

     this.saveProducts($scope.cart); 
     this.saveProductCounter($scope.productCounter); 

    }; 


$scope.addToCart = function (product) { 

     var found = false; 
     $scope.cart.forEach(function (item) { 
      if (item.id === product.id) { 
       item.quantity++; 
       $scope.productCounter++; 
       item.totalprice += parseFloat(item.price,6); 
       found = true; 
      } 

     }); 
     if (!found) { 
      $scope.cart.push(angular.extend({quantity: 1, totalprice: parseFloat(product.price,6) }, product)); 
      $scope.productCounter += 1; 
     } 


     this.saveProducts($scope.cart); 
     this.saveProductCounter($scope.productCounter); 

    }; 

Answer 1

Es ist der Umfang der ng-repeat bezogen.

Ändern Sie die currentQuantity in current.quantity und innerhalb von addToCart ändern Sie diesen Wert ebenfalls.

Fiddle

if (item.id === product.id) { 
    item.quantity++; 
    $scope.current.quantity++; 
    $scope.productCounter++; 
    item.totalprice += parseFloat(item.price,6); 
    found = true; 
} 

Ich muss sagen, dass Ihre Logik zu verstehen ist ziemlich hart, aber das behebt das Problem.