How use sort comparator in component

I would change the approach with the promise to something like this:

portals: {
    get: function(lastSetValue, resolve) {
      Portal.findAll({}).then(resolve);
    }
}

Then you can {{#each portals}}. http://jsbin.com/dosirecibu/edit?html,js,output

One pattern that’s been going around lately is to have a promise property alongside the value property:

portalsPromise: {
    get: function() {
        return Portal.findAll({});
    }
},
portals: {
    get: function(lastSetValue, resolve) {
      this.attr('portalsPromise').then(resolve);
    }
}

This allows you to observe the state of the promise by itself to show a loading indicator for instance.

However, I just noticed an issue with this, which is that once the promise resolves, the template will bind to portals for the first time (depending on template code), and due to then(), it will not resolve immediately, which results in the block rendering before the property has a value, which could throw errors if helpers/bindings expect it to exist.

Using the value property of promises seems to be a trend, but I think the reason it isn’t working for you is that you are sorting the promise value directly which might be a bug or not supported.