$ indice di Oggetto nell'array durante l'utilizzo di ng-repeat e un filtro

Question

Sono abbastanza nuovo da angolare e sono stato in grado di aggirare un po '. Ma non riesco a trovare la risposta a questo scenario ...

Ho una matrice di oggetti, che sto tirando giù da Firebase. Sto usando una ng-repeat per gli oggetti, quindi visualizzo i dati di conseguenza. Sto cercando di passare l'indice come routeparam a un controller "modifica". In tal caso, vorrei estrarre i dati dell'oggetto come si potrebbe anticipare. Tuttavia, quando filtro la ng-repeat, ottengo l'indice del contenuto filtrato. dove sto andando storto nel trovare il vero indice?

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

itinerario è al di sopra, al di sotto Controller è

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

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

E infine il frammento di codice HTML all'interno della ripetizione.

<div class="profileName"><a href="/profiles/{{$index}}">{{member.name}}</a><span class="handle">{{member.handle}}</span></div> 

Answer 1

Purtroppo $index è solo la "compensazione dell'elemento ripetuto iteratore (0..length-1)"

Se si desidera che l'indice originale si dovrebbe aggiungere che alla vostra collezione, prima filtraggio, o semplicemente non filtrare affatto gli elementi.

Un possibile approccio:

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> 

Ora, sembra anche che questo tipo di informazioni è davvero più come un ID di ogni altra cosa. Si spera che sia già parte del record e che sia possibile vincolarlo anziché utilizzare l'indice.

Answer 2

È possibile iniettare $route e utilizzare $route.current.params.index per ottenere il valore.

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

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

}); 

Answer 3

Ho appena imbattuti lo stesso problema e ho trovato questo supertrick sulle questioni git Agular

items.length - $index - 1 

come

<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> 

se siete in difficoltà come me dare un scatto:

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

Answer 4

Si potrebbe utilizzare una funzione per restituire l'indice dalla matrice

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

E la funzione

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

Sul mio esempio ho un array di oggetti chiamati "post", su cui io uso un filtra per ordinarli con una delle loro proprietà (proprietà "upvotes"). Quindi, nell'attributo "href" chiamo la funzione "getPostIndex" facendola passare tramite il riferimento, l'oggetto corrente.

La funzione getPostIndex() restituisce semplicemente l'indice dall'array utilizzando il metodo indexOf() dell'array Javascript.

La cosa bella di questo è che questa soluzione non è legata a un filtro specifico (come nella risposta @holographix) e funzionerà per tutti.

Answer 5

Prova questo:

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

indexOf restituisce sempre l'indice originale in un ng-repeat

Demo