How to implement filtering in Angular?

Question

Angular

Hello, there is a working filter:

<div class="myFilter">
  Введите название: <input type="text" ng-model="filter"> <br />
  Моторола: <input type="checkbox" ng-model="Motorola" ng-true-value="'Motorola'" ng-false-value=''> <br />
  Dell: <input type="checkbox" ng-model="Dell" ng-true-value="'dell'" ng-false-value=''> <br />
  Samsung: <input type="checkbox" ng-model="Samsung" ng-true-value="'samsung'" ng-false-value=''> <br />
  LG: <input type="checkbox" ng-model="LG" ng-true-value="'lg'" ng-false-value=''> <br />
  Nexus: <input type="checkbox" ng-model="Nexus" ng-true-value="'nexus'" ng-false-value=''> <br />
  Droid: <input type="checkbox" ng-model="Droid" ng-true-value="'droid'" ng-false-value=''> <br />
  Количество: <label>{{phones.length}}</label>

    <h1 ng-show="phones.length == 0 ">Товары с данными параметрами отсутствуют</h1>
      <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 phone" ng-repeat="phone in phones = (phones | filter:{name:filter} | filter:{name:Dell} | filter:{name: Motorola} | filter: {name:Samsung} | filter: {name:LG}| filter: {name:Nexus}| filter: {name:Droid})">
        <img ng-src="{{phone.imageUrl}}" alt="{{phone.name}}">
        <h1>{{phone.name}}</h1>
        <p>{{phone.snippet}}</p>
        <strong>{{phone.price}} $</strong>
      </div>
</div>

The code is fully working, but there is one BUT. If I select, for example, the checkbox with LG, then all LG phones are displayed to me, but if I uncheck the checkbox, nothing changes, but I would like the list to simply return to the initial (not filtered) view.

Answer 1

If hardcore, then hang a listener on all ng-model and if checkbox returns false, then filter = ''