Angularjs filter through array of object literals

Question

I am new to angular js so please forgive me for this basic question. I have an array of object literals and I want to add filter in angular js according to particular field type.

Array of object literals:

 var todos= [{text: 'To-DO1', done: false,group:'Group1' }, {text: 'To-do2', done: false, group:'Group2' } ];

I am using this code:

<select  data-ng-model="selectOption" data-ng-options="item as item.gtype for item in items"> </select>
<li data-ng-repeat="todo in todos track by $index | filter: selectOption.gtype ">

Above filter is not working

For populating the select I am using :

$scope.items = [                  
  {gtype:'Group1'},                         
  {gtype:'Group2'},`enter code here`
  {gtype:'Group3'},
  {gtype:'Group4'},
  {gtype:'Group5'}
];

Could someone please help me through ?

Anthony Chu · Accepted Answer · 2014-08-06 06:45:35Z

1

The problem is with the track by $index. The correct place for it is at the end of the expression, after the filter (see ngRepeat documentation)...

<li data-ng-repeat="todo in todos | filter: selectOption.gtype track by $index">

Live Demo

Edit: As requested, here's an updated fiddle to show an alternate message if filter produces nothing...

Live Demo

edited Aug 6, 2014 at 6:45

answered Aug 6, 2014 at 6:22

Anthony Chu

37.6k10 gold badges85 silver badges72 bronze badges

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

2 Comments

Aanjan Over a year ago

One more thing Anthony, If I want to display a message if nothing is present for that specific group then how can this be done ?

Anthony Chu Over a year ago

Check out the new fiddle I added to the answer. You can stash away the filtered results into a scope variable and use it in ngShow/ngHide.

Collectives™ on Stack Overflow

Angularjs filter through array of object literals

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related