Filter Pipe

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'filter',
  pure: false
})
export class FilterPipe implements PipeTransform {

  transform(value: any, filterString: string, propName: string): any {
    if (value.length === 0 || filterString === '') {
      return value;
    }
    const resultArray = [];
    for (const item of value) {
      if (item[propName] === filterString) {
        resultArray.push(item);
      }
    }
    return resultArray;
  }

}

<input type="text" [(ngModel)]="filteredStatus">

<ul class="list-group">
  <li
    class="list-group-item"
    *ngFor="let server of servers | filter:filteredStatus:'status'"
    [ngClass]="getStatusClasses(server)">
    <span
      class="badge">
      {{ server.status }}
    </span>
    <strong>{{ server.name }}</strong> |
  </li>
</ul>