AngularJS: значение свойства фильтра фильтра не обновляется автоматически при изменении

Question

У меня есть массив в области, который используется для заполнения ng-repeat с помощью флажков внутри.

У меня есть свойство в объекте, который я пытаюсь установить, чтобы содержать этот массив, фильтрованный флажками в проверке ng-repeat.

Basic HTML:

<div ng-controller="MyCtrl"> 
    <ul> 
     <li ng-repeat="box in boxes"><input type="checkbox" ng-model="box.checked" ng-click="testingOnly()"/> {{box.label}}</li> 
    </ul> 
    <div ng-repeat="object in objects.prop1">{{object.label}}</div> 
    <div ng-repeat="object in objects.prop2">{{object.label}}</div> 
</div> 

Basic JS:

function MyCtrl($scope, $filter) { 
    $scope.boxes = [{label: 'Mon'}, {label: 'Tue'}, {label: 'Wed'}, {label: 'Thu'}, {label: 'Fri'}, {label: 'Sat'}, {label: 'Sun'}]; 

    $scope.objects = { 
     prop1: [{label: 'You have chosen the following days:'}], 
     prop2: $filter('filter')($scope.boxes, {checked: true}) 
    } 

    $scope.testingOnly = function() { 
    $scope.objects.prop2 = $filter('filter')($scope.boxes, {checked: true}); 
    } 
} 

JSFiddle: http://jsfiddle.net/97ton8ua/5/

Я думаю, что я не понимая некоторую основную часть как Угловое работает. Я надеялся объединить две части, и что objects.prop2 будет обновляться без написания дополнительной вспомогательной функции.

Возможно ли это выполнить (через вложения модели/что-то в разметке/etc ...), или мне нужно будет поддерживать функцию-помощник при каждом щелчке по галочке?

Answer 1

Почему вы не идете об этом так и использовать два способа связывания, способ проще и чище, я думаю: FIDDLE

<div ng-app="myApp"> 
<div ng-controller="MyCtrl"> 
    <ul> 
     <li ng-repeat="box in boxes"> 
      <input type="checkbox" ng-model="selection.value" ng-true-value="{{box.label}}" ng-false-value="" />{{box.label}}</li> 


    </ul> 
     <div ng-repeat="object in objects.prop1">{{object.label}}</div>{{selection.value}} 

</div> 

</div> 

Угловая

angular.module('myApp', []) 

.controller("MyCtrl", function($scope, $filter) { 
    $scope.name = 'Superhero'; 
    $scope.boxes = [{ 
     label: 'something else' 
    }, { 
     label: 'world' 
    }]; 
    $scope.selection = {}; 
    $scope.objects = { 
     prop1: [{ 
      label: 'hello' 
     }] 
    }; 

});