Angular2 - Filter array of objects based on value of an object property

Question

I have an array of vehicles objects. I have tabs for different vehicle types for eg. 2-wheeler, 4-wheeler etc. While adding vehicle to the collection I am adding its type so my object kind of looks like this.

vehicles:[{
  key1:{ name: "Altima",type:"4-wheeler" },
  key2:{ name: "Harley",type:"2-wheeler" },
  key3:{ name: "Jeep",type:"4-wheeler" },
}]

Now I am retrieving all vehicles from server and want to add filter on frontend based on type. How can I add the filter for different tabs?

how to get all data form server could you add code here please — AddWeb Solution Pvt Ltd
– AddWeb Solution Pvt Ltd, Commented Dec 20, 2017 at 7:11
@AddWebSolutionPvtLtd Sorry its a part of project. This is just an example. But something like this. I am using firebase as my database.. — Krishna Nigalye
– Krishna Nigalye, Commented Dec 20, 2017 at 7:23
@Aravind by filter do you mean pipe? If yes, I am bit new to this so not sure how to implement one. — Krishna Nigalye
– Krishna Nigalye, Commented Dec 20, 2017 at 7:24

Sajeetharan · Accepted Answer · 2017-12-20 07:39:43Z

1

You can implement a pipe using array.filter and use it as follows,

export class MyFilter implements PipeTransform {

    transform(items: any[], term: any[]): any {
      if (!term) 
        return items;
      return items.filter(item => item.prefix.indexOf(term) > -1);
    }
}

answered Dec 20, 2017 at 7:39

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

AddWeb Solution Pvt Ltd · Accepted Answer · 2017-12-20 07:52:44Z

1

try like below code

 vehicles:any = [{
                  key1:{ name: "Altima",type:"4-wheeler" },
                  key2:{ name: "Harley",type:"2-wheeler" },
                  key3:{ name: "Jeep",type:"4-wheeler" },
                }];


datavehicle = [];


ngOnInit() {
   let vihicledata= this.vehicles[0];
   var array = Object.keys(vihicledata).map(function(k) {
     return vihicledata[k]
   });

    for(let i =0 ;i < array.length;i++){
      if(array[i].type == "4-wheeler"){
        this.datavehicle.push(array[i]);
      }
    }
    console.log('vehicle=>',this.datavehicle)
}

answered Dec 20, 2017 at 7:52

AddWeb Solution Pvt Ltd

21.8k5 gold badges30 silver badges61 bronze badges

1 Comment

Krishna Nigalye Over a year ago

This will definitely work but was looking more efficient solution (may be involving filter).

Collectives™ on Stack Overflow

Angular2 - Filter array of objects based on value of an object property

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related