AngularJS: operare sugli elementi di un loop creato con la direttiva ng-repeat

Un loop creato in AngularJS con la direttiva ng-repeat può essere gestito operando sui singoli elementi che lo compongono.

Supponiamo di dover aggiungere un pulsante per eliminare un elemento:

<ul id="items" ng-controller="ListCtrl">
	<li ng-repeat="item in items" class="row">
		<span class="pull-left">{{item.name}}</span>
		<a ng-click="removeItem(item)" class="pull-right">&times;</a>
	</li>
</ul>

Il metodo removeItem() che definiremo nel nostro controller opererà sull'elemento corrente del loop passato come argomento:

angular.module('MyApp').controller('ListCtrl', [ '$scope', function($scope) {
	$scope.items = [
		{
			name: 'A',
			id: 1
		},
		{
			name: 'B',
			id: 2
		},
		{
			name: 'C',
			id: 3
		}
	];

	$scope.removeItem = function(item) {
		var items = $scope.items;
		for(var i = 0; i < items.length; ++i) {
           if(items[i].id == item.id) {
              items.splice(i, 1);
              break;
            }
        }
	};
}]);

La procedura rimane la medesima anche per altre operazioni sugli elementi: il metodo del controller opererà sempre sull'elemento corrente nel loop.