JSFiddle - React, Tailwind, and code Playground

by Jesse Florig

HTML

<div ng-app>
    <p>Now when you clear the search textbox, the objects with the null properties are returned to the list.</p>
    <div ng-controller="ListCtrl">
        <input type="text" ng-model="search.age" ng-change="clear()" placeholder="Age"></input>
        <ul>
            <li ng-repeat="item in items | filter:search">
                {{item.name}} - {{item.age}}
            </li>
        </ul>
    </div>
    <p>Hint: '!' returns all nulls and '!!' returns all not nulls</p>
</div>

JavaScript

function ListCtrl($scope) {
  $scope.items = [
    {'name':'Carl', 'age':69},
    {'name':'Neil', 'age':54},
    {'name':'Richard'},
    {'name':'Chris', 'age':58}
  ];
    
    $scope.clear = function(){
        if($scope.search.age.length == 0){
            delete $scope.search.age;
        }
    }
}