How To Use .filter() In Angular

In this blog, you will learn how to use .filter() in Angular.

In this blog, you are going to see how to use .filter() function in Angular. I will explain to you how it works with a simple example.

 

You have an array containing multiple objects, each one representing an employee, but only want some of the objects in it. That’s where .filter() comes in.

 

Here is our data,

var employees = [
  {
    "id": 11,
    "name": "Ravishankar",
    "role": "Developer"
  },
  {
    "id": 12,
    "name": "Muthu",
    "role": "Developer"
  },
  {
    "id": 13,
    "name": "Mani",
    "role": "Tester"
  },
  {
    "id": 14,
    "name": "Ajith",
    "role": "Tester"
  }
]

So we want two arrays, one for employee a role is a Developer and another one is for Tester. You can achieve this using .filter() like below,

var developers = employees.filter(employee => employee.role == "Developer");

var Testers = employees.filter(employee => employee.role == "Tester");

If the callback function returns true then the current value will be stored in the array, if it returns false then it won't be.

 

That’s it, I hope you have learned how to use .filter() in Angular.