Ich bin ziemlich neu in eckigen und konnte mich etwas bewegen. Aber ich kann die Antwort auf dieses Szenario nicht finden ...

Ich habe eine Reihe von Objekten, die ich von der Feuerbasis herunterziehe. Ich verwende eine ng-Wiederholung für die Objekte und zeige dann die Daten entsprechend an. Ich versuche, den Index als Routeparam an einen "Edit" -Controller zu übergeben. In diesem Fall möchte ich die Objektdaten wie erwartet abrufen. Wenn ich jedoch die ng-Wiederholung filtere, erhalte ich den Index des gefilterten Inhalts. Wo gehe ich falsch, wenn ich den wahren Index finde?

  .config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
  .when('/profiles/:index', {
    templateUrl: '../views/profile.html',
    controller: 'profileCtrl'
  });

Die Route ist oben, der Controller ist unten

  .controller('profileCtrl', function( $scope, $routeParams ){

$scope.teamProfile = $scope.ourTeam[$routeParams.index];
    $scope.index = $routeParams.index;
});

Und schließlich das HTML-Snippet aus der Wiederholung.

<div class="profileName"><a href="/profiles/{{$index}}">{{member.name}}</a><span class="handle">{{member.handle}}</span></div>
17
lutonmedia 21 Nov. 2013 im 07:02

5 Antworten

Beste Antwort

Leider ist $index nur der "Iterator-Offset des wiederholten Elements (0). .Länge-1) "

Wenn Sie den ursprünglichen Index möchten, müssen Sie diesen vor dem Filtern zu Ihrer Sammlung hinzufügen oder die Elemente einfach überhaupt nicht filtern.

Ein möglicher Ansatz:

angular.forEach(members, function(member, index){
   //Just add the index to your item
   member.index = index;
});

<div ng-repeat="member in members">
   <a href="/profiles/{{member.index}}">
</div>

Nun scheint es auch, dass diese Art von Informationen eher einer ID ähnelt als irgendetwas anderem. Hoffentlich ist das bereits Teil des Datensatzes, und Sie können daran binden, anstatt den Index zu verwenden.

11
Josh 21 Nov. 2013 im 03:16

Ich bin gerade über das gleiche Problem gestolpert und habe diesen Supertrick bei den eckigen Git-Problemen gefunden

items.length - $index - 1

Mögen

    <div ng-repeat="item in ['item', 'item', 'item'] | reversed">
      <!-- Original index: 2, New index: 0 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
      <!-- Original index: 1, New index: 1 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
      <!-- Original index: 0, New index: 2 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
    </div>

Wenn Sie in Schwierigkeiten sind wie ich, probieren Sie es aus:

https://github.com/angular/angular.js/issues/4268

4
holographix 2 Dez. 2014 im 16:24

Sie können eine Funktion verwenden, um den Index aus dem Array zurückzugeben

<div ng-repeat="post in posts | orderBy: '-upvotes'">
   <a href="#/posts/{{getPostIndex(post)}}"></a> 
</div>

Und die Funktion

$scope.getPostIndex = function (post) {
    return $scope.posts.indexOf(post); //this will return the index from the array
}

In meinem Beispiel habe ich ein Array von Objekten namens "posts", für die ich einen Filter verwende, um sie nach einer ihrer Eigenschaften zu ordnen ("upvotes" -Eigenschaft). Dann rufe ich im Attribut "href" die Funktion "getPostIndex" auf, indem ich das aktuelle Objekt als Referenz übergebe.

Die Funktion getPostIndex () gibt einfach den Index aus dem Array zurück, indem die Methode indexOf () des Javascript-Arrays verwendet wird.

Das Schöne daran ist, dass diese Lösung nicht an einen bestimmten Filter gebunden ist (wie in der Antwort von @holographix) und für alle funktioniert.

6
watsabitz 5 März 2016 im 22:22

Sie können $route injizieren und $route.current.params.index verwenden, um den Wert zu erhalten.

.controller('profileCtrl', function( $scope, $route ) {

     $scope.index = $route.current.params.index;

});
0
Josh Lowe 25 Juni 2014 im 14:15

Versuche dies :

<div ng-repeat="member in members">
{{members.indexOf(member)}}
</div>

IndexOf gibt immer den ursprünglichen Index in einer ng-Wiederholung zurück

Demo

33
Manas 7 Mai 2016 im 07:26