$index de l'Objet du Tableau tandis que l'aide de ng-repeat et un filtre

Im assez nouveau à l'angulaire et ont été en mesure de se déplacer un peu. Mais je ne peux pas l'air de trouver la réponse à ce scénario...

J'ai un tableau d'objets, que je suis en tirant vers le bas à partir de firebase. Je suis en utilisant un ng-repeat pour les objets, puis l'affichage de données en conséquence. Je suis en train de passer l'indice routeparam à un "edit" de la manette. Dans ce cas, je tiens à tirer les données de l'objet que l'on pourrait anticiper. Cependant, lorsque je filtre le ng-repeat, je suis l'index du contenu filtré. où vais-je mal à trouver le véritable indice?

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

Itinéraire ci-dessus, le Contrôleur est en dessous de

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

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

Et enfin l'extrait de code html à partir de l'intérieur de la répétition.

<div class="profileName"><a href="/profiles/{{$index}}">{{member.name}}</a><span class="handle">{{member.handle}}</span></div>
Vouliez-vous dire {{index}} au lieu de {{$index}}?

OriginalL'auteur lutonmedia | 2013-11-21

  1. 11

    Malheureusement $index n'est que le "itérateur décalage de la répétition de l'élément (0..longueur-1)"

    Si vous voulez l'indice d'origine vous devez l'ajouter à votre collection avant le filtrage, ou tout simplement ne pas filtrer les éléments à tous.

    Une approche possible:

    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>

    Maintenant, il semble également que ce type d'information est vraiment plus comme un ID qu'autre chose. J'espère que c'est déjà une partie de l'enregistrement, et que vous pouvez lier qu'au lieu d'utiliser l'index.

    et si vous êtes à itérer tableau de chaînes de caractères? vous ne serez pas en mesure d'ajouter un attribut (index).

    OriginalL'auteur Josh

  2. 33

    Essayez ceci :

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

    indexOf renvoie toujours l'indice d'origine dans un ng-repeat

    Démo

    OriginalL'auteur Manas

  3. 6

    Vous pouvez utiliser une fonction pour retourner à l'index du tableau

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

    Et la fonction

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

    Sur mon exemple, j'ai un tableau d'objets appelés "postes", sur lequel j'utilise un filtre à l'ordre par l'un de leurs propriétés ("upvotes de la propriété"). Puis, dans l'attribut "href" j'appelle "getPostIndex" de la fonction en lui passant par référence, l'objet courant.

    La getPostIndex() la fonction retourne simplement l'index à partir de la matrice à l'aide de Javascript array méthode indexOf ().

    La bonne chose à ce sujet est que cette solution n'est pas liée à un filtre spécifique (comme dans @holographix réponse) et pour chacun d'eux.

    OriginalL'auteur Soky

  4. 3

    J'ai juste trébuché à travers le même problème et j'ai trouvé ce supertrick sur le agular git questions

    items.length - $index - 1

    comme

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

    si vous êtes en difficulté comme moi de donner un coup de feu:

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

    Si vous n'êtes pas à l'aide d'un filtre de ce qui serait la meilleure solution. Le filtre à vis de votre index.

    OriginalL'auteur holographix

  5. 0

    Vous pouvez injecter $route et l'utilisation $route.current.params.index pour obtenir la valeur.

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

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

});

    OriginalL'auteur Awakening