选择 JSON 对象的子集并对其进行计数答案

【问题标题】：Selecting a subset of a JSON object & counting it选择 JSON 对象的子集并对其进行计数
【发布时间】：2014-04-15 21:42:43
【问题描述】：

我在这里玩得很开心，可能是因为我对 Angular 很陌生，而且我还没有完全理解所有内容。

首先是场景，然后是一些代码：

我有一个从 API 调用中获取 JSON 对象的按钮。它变成了 $scope.collectors。

$http.post('get', $scope.formData).success(function(data) {
    $scope.collectors = data.results;
...

然后我会用复选框列出这些项目的大清单，这样您就可以选择要使用的项目。当你选择了你想要的，你点击另一个按钮来收集所有这些，然后对它们进行批量操作。

这就是整个故事。我遇到麻烦的任务是双重的。首先，我只是想计算检查的项目数。我是这样做的：

JS:
    $scope.selectedCollectors = {};

HTML:
    <div ng-repeat="collector in collectors">
        <input type="checkbox" name="collector-id" 
               value="{{collector.id}}"
               ng-model="selectedCollectors[collector.id]">
    </div>
    <p>Debug: {{ selectedCollectors }}</p>
    <p>There are {{ selectedCollectors.length }} items checked</p>

当我选择项目时，selectedCollectors 的输出与预期的一样：

{"8596784":true,"7458347":true}

但是 {{ selectedCollectors.length }} 永远不会增加或显示任何内容。

第二件事基本上是我想要做的是根据用户的选择获取原始 JSON 对象的子集。除了遍历 $scope.collectors 中的每个项目并将 ID 与 selectedCollectors 中的 ID 进行比较之外，还有更好的 Angular 方式来获取这个子集吗？

有些东西让我觉得我应该把这个 JSON 对象变成一个纯数组，但也许不是……

感谢任何建议或帮助。

【问题讨论】：

collectors 是数组吧？
selectedCollectors 是一个对象，因此它没有length 属性。

标签： javascript angularjs checkbox filter

【解决方案1】：

这是我的解决方案。 http://jsfiddle.net/wittwerj/962wm/

首先，我让 Angular 为选中的收集器对象添加一个“selected”属性：
<div ng-repeat="collector in collectors">
<input type="checkbox" name="collector-id" value="{{collector.id}}"
ng-model="collector.selected" />
</div>

然后第二个 ng-repeat 创建选定收集器的过滤子集(see this question):
<div ng-repeat="collector in (selectedCollectors = (collectors | filter:{selected: true}))">

请注意，第二个 ng-repeat 不会生成任何标记 - 只是 selectedCollectors 数组，可以像范围变量一样访问它。

【讨论】：