3

I have some data:

0: {id: 1, name: "hhh", description: "hhh", isPopular: false,…}
1: {id: 2, name: "bbb", description: "bbb", isPopular: true,…}
2: {id: 3, name: "ccc", description: "ccc", isPopular: false,…}
3: {id: 4, name: "ddd", description: "ddd", isPopular: true,…}
4: {id: 5, name: "aaa", description: "aaa", isPopular: false,…}
5: {id: 6, name: "ggg", description: "ggg", isPopular: false,…}

I would like to appear in an ng-select as:

Popular
bbb
ccc
The rest
aaa
ccc
ggg
hhh

So I've used

<select ng-selected="true"
    ng-options="category.name group by category.isPopular for category in ctrl.categories |
        orderBy: ['-isPopular','name']"
    ng-model="myModel.category">
</select>

However this is returning:

aaa
ccc
ggg
hhh
true
bbb
ccc

How I can label the groups and order by the group?

georgeawg
  • 48,608
  • 13
  • 72
  • 95
StuperUser
  • 10,555
  • 13
  • 78
  • 137
  • have you tried something like `... group by category.isPopular ? 'Popular' : 'The rest' ...`? – rob Jul 10 '15 at 13:27
  • @rob You should make this an answer so others can find it more easily in the future. I'll upvote if you do! – kiswa Jul 10 '15 at 13:50
  • Will do. Wasn't sure if that would actually work – rob Jul 10 '15 at 13:52

2 Answers2

3

You need to pass in the name of the group to group by. For example:

<select ng-selected="true"
    ng-options="category.name group by category.isPopular ? 'Popular' : 'The rest' for category in ctrl.categories |
        orderBy: ['-isPopular','name']"
    ng-model="myModel.category">
</select>
rob
  • 17,995
  • 12
  • 69
  • 94
2

I'm pretty sure if you want to group you should use this:

<select ng-selected="true"
    ng-options="category.name for category in ctrl.categories |
        groupBy: 'category.isPopular' |
        orderBy: ['-isPopular','name']"
    ng-model="myModel.category">
</select>

groupBy is in Angular-filter, so you have to get the syntax right.

kiswa
  • 14,737
  • 1
  • 21
  • 29