angularjs - Angular JS，过滤时记住复选框状态

Question

我正在尝试创建一个带有复选框和搜索框的列表。

HTML

  <div ng-controller="MainCtrl">
    <input type="text" placeholder="Search" ng-model="query">
    <div ng-repeat="item in items | filter:query">
      <input type="checkbox" id="{{item.id}}" value="{{item.id}}">{{item.name}}
    </div>
  </div>

JS

myApp.controller('MainCtrl', function ($scope) {
  $scope.items = [
    {
      "id": 1,
      "name": "Green",
    },
    {
      "id": 2,
      "name": "Yellow",
    },
    {
      "id": 3,
      "name": "Blue",
    },
    {
      "id": 4,
      "name": "Red",
    }
  ];
});

问题是当我通过搜索框搜索时，复选框状态没有保存。例如，当我选中“绿色”时，我在文本框中键入其他内容，然后删除该文本，不再选中选中的“绿色”。我怎样才能对复选框状态有“内存”？

这是 plunker 的链接:http://plnkr.co/edit/KHq3AA4guGKA4AqxQrF8

Answer 1

我建议你在你的 items 数组中为每个 item 添加一个属性，它可以作为 item.checked 访问/p>

标记

  <div ng-controller="MainCtrl">
    <input type="text" placeholder="Search" ng-model="query">
    <div ng-repeat="item in items | filter:query">
      <input type="checkbox" ng-model="item.checked">{{item.name}}
    </div>
  </div>

Working Plunkr