J'ai un modèle dans lequel je veux générer du HTML uniquement si l'élément actuel contient des champs différents de l'élément précédent. Comment puis-je accéder à l'élément précédent dans un ng-repeat?
Vous pouvez faire quelque chose comme
<div ng-app="test-app" ng-controller="MyController">
<ul id="contents">
<li ng-repeat="content in contents">
<div class="title">{{$index}} - {{content.title}} - {{contents[$index - 1]}}</div>
</li>
</ul>
</div>
JS
var app = angular.module('test-app', []);
app.controller('MyController', function($scope){
$scope.contents=[{
title: 'First'
}, {
title: 'Second'
}, {
title: 'Third'
}]
})
Démo: Fiddle
Attention:$index
correspond au tableau de directives, qui peut être différent du tableau de portée Utilisez une variable en ligne pour accéder au tableau correct.
<li ng-repeat="content in (correctContents = (contents | orderBy:'id'))">
{{ correctContents[$index - 1] }} is the prev element
</li>
Si vous filtrez ou commandezPar, contents[$index] != content
.
Une solution consiste à utiliser l'index $ pour cibler l'élément précédent:
HTML:
<div ng-repeat="item in items">
<span>{{$index}}: </span>
<span ng-show="items[$index-1].name=='Misko'" ng-bind="item.name"></span>
</div>
JS:
app.controller('AppController',
[
'$scope',
function($scope) {
$scope.items = [
{name: 'Misko'},
{name: 'Igor'},
{name: 'Vojta'}
];
}
]
);
Pourquoi ne pas utiliser key
à partir de ng-repeat
? ($index
semble délicat comparé à key
)
<div ng-repeat="(key, item) in data">
<p>My previous item is {{ data[key-1] }}, my actual item is {{ item }}
</div>
<li ng-repeat="item in items">
{{items[$index - 1].att == item.att ? 'current same as previous' : 'current not same as previous'}}
</li>