lundi 4 mai 2015

Angular JS, remember checkbox status when filtering

I'm trying to create a list with checkboxes with a search box.

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",
    }
  ];
});

The problem is that the checkboxes status are not saved when I'm searching through the search box. For example, when I check "Green", I type on text box something else, then remove this text, the checked "Green" is not checked anymore. How can I have "memory" on checkboxes status?

Here is a link to plunker: http://ift.tt/1R7bTi4




Aucun commentaire:

Enregistrer un commentaire