Pipe in Angular 4

What is Pipe in Angular 4 ?

|” this called pipe and pipe using for transform data.

–HTML File

<table class="table">
<tbody>
<tr *ngFor="let user of list">
<td>{{user.name}}</td>
<td>{{user.joining_date}}</td>
<td>{{user.age}}</td>
</tr>
</tbody>
</table>

There you can see some names are title case and some are uppercase. I want to all of lowercase.

<table class="table">
<tbody>
<tr *ngFor="let user of list">
<td>{{user.name | lowercase}}</td>
<td>{{user.joining_date}}</td>
<td>{{user.age}}</td>
</tr>
</tbody>
</table>

Now I want to all names should be in uppercase.

<table class="table">
<tbody>
<tr *ngFor="let user of list">
<td>{{user.name | uppercase}}</td>
<td>{{user.joining_date}}</td>
<td>{{user.age}}</td></tr>
</tbody>
</table>

Now I want there should be a filter like

Leave a Reply

Your email address will not be published. Required fields are marked *