Best way to group model items by a property

1

I’m trying to group items (e.g. posts) on a given route by a property (e.g. category). I envision showing a lists of categories, and up to 10 of the most recent posts per category.

I’m unsure how to approach this, but came across this ember-group-by add-on that seems to fit the bill.

I’m curious how more experienced Embereños would tackle this. Thanks.

2

I think for most uses, that addon would work great. Writing a computed property yourself would not be too difficult either.

For more sophisticated uses, you could look at the ember-cli-d3 shape addon. This allows you to easily use the very powerful d3 data manipulation functions. Specifically, d3’s nest is used for grouping. It allows you to do multi-level grouping, key sorting, rollups, etc. For example, if you wanted to group by category, then by year, you could write a computed property like this:

import { nest } from 'd3-collection';
import { ascending, descending } from 'd3-array';

...

  postsByCategoryAndYear: Ember.computed('posts', function() {
    let posts = this.get('posts');

    return nest()
      .key((d) => d.category).sortKey(ascending)
      .key((d) => d.year).sortKey(ascending)
      .entries(posts);
  })

NOTE: This assumes the posts are POJOs. If you have Ember objects, then you can update d.category to d.get('category') for instance.

3

In addition to your note, it’s also very important to use posts.toArray() - d3 is looking for plain Javascript arrays, and ember model Classes throw it off.