Filtrowanie tablicy przy użyciu pól wyboru z AngularJS

Mam następujący kod, w którym próbuję filtrować graczy w tablicy, zaznaczając pole wyboru dla spodni gracza.

Wiem, że mam tablicę danych w repeaterze, a następnie wejścia filtrujące w elemencie poza elementem tablicy danych (dwa różne divy), czy to może być przyczyną rozłączenia? Ponieważ zauważam, kiedy dodam pole wyboru do elementu repeatera, otrzymuję pewną formę tablicy opinii, gdy klikam pole wyboru.

Wiązanie pola wejściowego wyszukiwania było tak łatwe do zaimplementowania, jednak spędzam zbyt wiele czasu na otrzymaniu tego prostego pola wyboru do filtrowania danych.

Więc teraz zwracam się do społeczności Angular, aby uzyskać niewielką pomoc w filtrowaniu z polami wyboru, ponieważ dokumentacja nie obejmuje tego tematu bardzo dobrze.

Oto skrzypce:http://jsfiddle.net/rzgWr/1/

<div ng-controller="MyCtrl">
<div>
<div ng-repeat="pants in players | groupBy:'pants'">
    <b><input type="checkbox" ng-model="query"/>{{pants}}</b>
    <span>({{(players | filter:pants).length}})</span>
</div>

<div>
    <ul>
    <li ng-repeat="player in players | filter:query">
        <p><b>{{player.name}}</b></p>
        <p>{{player.shirt}} {{player.pants}}, {{player.shoes}}</p>
    </li>
    </ul>    
</div>
</div>

function MyCtrl($scope, filterFilter) {
$scope.players = [
    {name: 'Bruce Wayne', shirt: 'XXL', pants: '42', shoes: '12'},
    {name: 'Wayne Gretzky', shirt: 'XL', pants: '38', shoes: '10'},
    {name: 'Michael Jordan', shirt: 'M', pants: '32', shoes: '9'},
    {name: 'Player Two', shirt: 'XXL', pants: '42', shoes: '12'}
]; 

$scope.$watch('filtered', function (newValue) {
    if (angular.isArray(newValue)) {
        console.log(newValue.length);
    }
}, true);    

}

Wszelka pomoc / rada jest szczerze doceniana.

Dzięki.

questionAnswers(2)

yourAnswerToTheQuestion