AngularJS - Wie der Zugriff auf das nächste Element aus einem ng-repeat in der Steuerung

Ich würde gerne Zugriff auf die Parameter des nächsten Elements auf dem Bildschirm, wenn Sie auf eine Schaltfläche.

Verwende ich eine ng-repeat in meiner html-Datei:

<li ng-repeat="item in items | filter:query" ng-show="isSelected($index)">
    <a href="" ng-click="itemNext()"><img src="xxx.jpg" /></a>
</li>

Und der index in meinem Controller mit einer Schleife:

$scope.itemNext = function () {
    $scope._Index = ($scope._Index < $scope.nbItems - 1) ? ++$scope._Index : 0;
    $scope.functionToCallWithNextItem(nextItem.param1);
};

Einem einfachen $scope.items[$scope._Index].param1 statt nextItem.param1 würde nicht funktionieren, da die Daten so gefiltert $index+1 aus $scope.items ist nicht unbedingt das gute.

Irgendeine Idee ?

  • haben Sie eine spezifische Frage? was funktioniert nicht wie erwartet?
  • wo ist nextItem erklärt? wo ist _Index verwendet? es gibt viele Fehlstellen.
  • nextItem existiert nicht, ich wusste nicht, was zu setzen, anstatt, dass ist eigentlich das, was ich suchte... "_Index" ist der aktuelle index des Elements auf dem Bildschirm.
InformationsquelleAutor Fred | 2014-03-10
  1. 20

    Können Sie ordnen Sie Ihre gefilterten Daten an eine variable:

    <li ng-repeat="item in (filteredItems = (items | filter:query))">

    Dann verwenden $index + 1 zu bekommen, der nächste Punkt:

    <a ng-click="itemNext(filteredItems[$index + 1])">

    Demo: http://plnkr.co/edit/OdL5rIxtTEHnQCC3g4LS?p=preview

    • danke @tasseKATT, das klappt einwandfrei ! Aber wie kann ich mit der Schleife auf das erste Element bei erreichen des letzten Elements das auf diese Weise ?
    • (klicken Sie auf some_item_9 von Ihrem plunker Beispiel, um zu sehen, was ich meine)
    • wenn es für Sie arbeitet, kreuzen Sie die Antwort akzeptiert
    • Ich fand, dass das hinzufügen dieser auf der Oberseite des itemNext () - Funktion kann eine Lösung sein: if(item === undefined) item = $scope.filteredItems[0]; was denkst du ? Plunker aktualisiert: plnkr.co/Bearbeiten/b66BTsVRGIqP9jb2RShc?p=Album Vorhören
    • Je nachdem, wo Sie möchten fügen Sie die Logik. Können immer mit dem ternären operator und $last zu überprüfen, wenn das wiederholte element ist das Letzte in der iterator: ng-click="itemNext($Letzte ? filteredItems[0] : filteredItems[$index + 1])"
    • ok, aber gibt es eine Möglichkeit, um den index des nächsten Elements in der Steuerung so ? wie bekomme ich den index, wenn ich den Artikel an sich eigentlich ? Ohne es als parameter übergeben in der Funktion offensichtlich.
    • wichtigste Frage ist: wie nennen die itemNext() Funktion, die zur Initialisierung der app, wenn ich nur den Namen des Elements. sagen wir mal in den plunker Beispiel möchte ich simulieren, klicken Sie auf some_item_7 beim Start der app, wie soll ich das tun ?
    • Sie können mithilfe des $filter-service zum ausführen der Filterung im controller statt. Vielleicht so etwas wie dieses: plnkr.co/Bearbeiten/tiBNnDkM5lU3iW2GyNCn?p=Album Vorhören

    InformationsquelleAutor tasseKATT
  2. 0

    Es ist einfach, dass

    <div ng-repeat="item in items">
     current: {{item.value}}
     next: {{ items[$index + 1].value}}
     previous: {{ items[$index - 1].value}}
</div>
    InformationsquelleAutor Silvio Troia
Schreibe einen Kommentar