AngularJS - ngRepeat & checkboxes
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css">
<div ng-controller="MyCtrl">
<table class='table table-bordered'>
<tr ng-repeat="obj in myObjects">
<td>{{obj.id}}
<input type="checkbox" ng-checked='obj.checked' ng-click="checked($index, $event)">
</td>
<td>test {{obj.id}}</td>
</tr>
</table>
{{info}}
</div>
JavaScript
function MyCtrl($scope) {
$scope.myObjects = [{
id: 1,
checked: false
}, {
id: 2,
checked: false
}, {
id: 3,
checked: false
}, {
id: 4,
checked: false
}, {
id: 5,
checked: false
}, {
id: 6,
checked: false
}, {
id: 7,
checked: false
}];
$scope.checked = function($index, $event) {
$scope.info = 'index: ' + $index + ', event: ' + $event + ', shift key: ' + $event.shiftKey + ', lastChecked: ' + $scope.lastChecked;
if (typeof $scope.lastChecked != 'undefined' && $event.shiftKey) {
for (i = $scope.lastChecked; i <= $index; i++) {
$scope.myObjects[i].checked = true;
}
}
$scope.lastChecked = $index;
$scope.myObjects[$index].checked = true;
}
}