Angular 7 Pipes

app.component.html

<h1>
  Angular 7 Pipes
</h1>
<div>
  <div>
    <input type="search" placeholder="Search" [(ngModel)]="searchTerm">
  </div>
  <div>
    <table class="user-table">
      <thead class="user-table-header">
        <tr>
          <td>ID</td>
          <td>First Name</td>
          <td>Last Name</td>
          <td>Country</td>
          <td>Gender</td>
          <td>Age</td>
        </tr>
      </thead>
      <tbody class="user-table-body">
        <tr *ngFor="let user of userData | userSearch:searchTerm">
          <td>{{user.id}}</td>
          <td>{{user.first_name}}</td>
          <td>{{user.last_name}}</td>
          <td>{{user.country}}</td>
          <td>{{user.gender}}</td>
          <td>{{user.age}}</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>