CODEWITHSUNDEEP
angularjs
Locotes
Locotes

Reputation: 91

Angular: For a dropdown that filters a list, can a counter be added to each dropdown option?

I have a dropdown that is being used to filter a list of data.

I also have a counter (underneath the dropdown) that shows how many results have been returned by the filter.

However, is it possible to append the counter to each option in the dropdown itself? So the dropdown options would look like this for example...

Show all (6)
Show x (2)
Show y (1)
Show z (3)

At the moment each option will always show the same number (see below), because it's only getting the current filter value... 

Show all (6)
Show x (6)
Show y (6)
Show z (6)

Is it possible, or am I expecting too much from the filter?

Here is an example of what I mean: Example

Upvotes: 1

Views: 457

Answers (1)

Vipul Agarwal
Vipul Agarwal

Reputation: 1641

You can get this as below:

Add the below function in your controller:

$scope.getCount = function(rating){
    var count = 0;
    var list = $filter('filter')($scope.data, {'rating' :rating}, true);
    if(list != null){
      count = list.length;
    }
    return count;
  };

Update the code in your html as below:

ng-options="item.name + ' (' + (getCount(item.rating)) + ') ' for item in filterOptions.stores">

Updated Plunker:http://plnkr.co/edit/Q5Vs1mqomQJWmZdxRRxp?p=preview

Hope this helps!!

Upvotes: 1

Related Questions