While-Schleife mit AngularJS?

Ich versuche zu imitieren, die while-Schleife von plain Javascript, AngularJS. Ich wollen einfach nur zu rufen, der createPlant () - Methode x-Anzahl der Zeiten, die nach dem Wert der Menge input, wenn Sie den "hinzufügen" - button geklickt wird, wie folgt (es fügt an ein array "Pflanzen"):

$("#add").on("click", function() {
    var i = 0;
    while (i < $("#pQuantity").val()) {
        createPlant();
        i += 1;
    };

In Eckigen habe ich noch:

HTML

<button ng-click="addPlant()" type="button">Add</button>

Und ich bin mir nicht sicher, wie das Skript Aussehen würde, aber das ist, was ich falsch gesagt:

JS

var i = 0;
while (i < $("#pQuantity").val()) {
    $scope.addPlant = function() {
        var plant = {name: $("#pVariety").val()};
        $scope.plants.unshift(plant);
    };
    i += 1;
};
Gibt es irgendeinen Grund, warum man mit einer while-Schleife statt einer for-Schleife?
Kein Grund, was auch immer funktioniert.
Eckig ist nur JavaScript verwenden, so können Sie while Schleifen ganz gut. Das heißt, das, was du zeigst, ist eine schlechte while-Schleife. Wenn Sie darauf bestehen, auf while verwenden var i=parseInt($("#pQuantity").val()); while(i--) { ... }, aber du bist die Zuweisung einer variable, und die Aktualisierung jeder iteration, so dass Sie wirklich wollen, eine for Schleife statt, weil das, was for loops sind für.
warum wollen Sie einführen-Selektor basiert javascript (jQuery) in Winkel-controller..Sie hätte ng-model statt Lesen Wert mit .val()
Tipp: entfernen Sie jQuery von Ihrem Projekt und Sie werden verstehen, Eckige viel besser.

InformationsquelleAutor muninn9 | 2016-01-30

  1. 1

    Ich unterstütze was @dfsq sagte Sie in dem Kommentar. Nicht jQuery verwenden, wenn Sie mit angular... unleash the angular power! 😛

    Für Ihre Lösung, die Sie tun sollten, so etwas wie dieses:

    Ihre JS:

    $scope.result="";
$scope.addPlant = function(){
  for (i=0; i<$scope.someValue;i++){
    //do something
    $scope.result=$scope.result+i.toString()+",";      
  }
};

    HTML:

    <body ng-controller="MainCtrl">
  <input type=number ng-model="someValue" />
  <button ng-click="addPlant()">CLICK ME</button>
  <div>{{result}}</div>
</body>

    Plunker Probe

    InformationsquelleAutor Ziv Weissman

Schreibe einen Kommentar