How to show all values when AngularJS strict filter field is empty?

sachin · August 2021

I have a table which can be filtered by several columns. The filter is strict. However, it shows an empty table. How to apply a strict filter only to non-empty values? I need to show all results when a strict filter input is blank.

<table id="searchTextResults">
        <tr><th colspan="2">Strict filter</th></tr>
        <tr><th>Name</th><th>Phone</th></tr>
        <tr ng-repeat="friend in friends | filter:searchText:true">
          <td>{{friend.name}}</td>
          <td>{{friend.phone}}</td>
        </tr>
</table>

array of data,

[
    {name:'John', phone:'555-1276'},
    {name:'Mary', phone:'800-BIG-MARY'},
    {name:'Mike', phone:'555-4321'},
    {name:'Adam', phone:'555-5678'},
    {name:'Julie', phone:'555-8765'},
    {name:'Juliette', phone:'555-5678'}
]

sachin · August 2021

You need to create a custom filter in your controller

var app = angular.module('myApp', []);
app.controller('myController', function($scope) {
  $scope.strict_blank = function (input, searchParam) {
    if (searchParam == '')
      return true;
    return angular.equals(input, searchParam);
  }
  $scope.searchText = '';
});

Example:

Angularjs display all with blank input in strict filter

How to show all values when AngularJS strict filter field is empty?

Answers

Howdy, Stranger!

Quick Links

Categories