filterBy - binding to it from another object?


#1

Let me just show a code snippet:

import Ember from ‘ember’;

let PropSvc = Ember.Object.extend({
  init() {
    let promise = this.get('store').findAll('investment-property');
    this.set('all', promise);
  },

  owned: Ember.computed('all.@each.owned', function() {
    return this.get('all').filterBy('owned', true);
  })
});

let PropCnt = Ember.Object.extend({
  count: Ember.computed('properties.[]', function() {
    return this.get('properties.length');
  })
});

export default Ember.Route.extend({
  setupController(ctrl) {
    let propSvc = new PropSvc({store: this.get('store')});
    let propCnt = new PropCnt({properties: propSvc.get('all')});
    let ownedCnt = new PropCnt({properties: propSvc.get('owned')});

    ctrl.set('propSvc', propSvc);
    ctrl.set('propCnt', propCnt);
    ctrl.set('ownedCnt', ownedCnt);
  }
});

I have two objects, one is a basic service that aggregates “investment properties” - another gathers aggregates on investment properties. To keep this simple, the latter only counts the properties.

The service is very basic - you can bind to all properties, or a subset (only those that are owned).

Sadly, if I display {{ownedCnt.count}} in a template, it displays 0 (propCnt.count shows the correct number). Clearly, the binding isn’t being set up properly for that which is returned by filterBy.

What am I missing?

Screenshot of output: Binding to propSvc.owned in the template updates, but the ownedCnt object does not. https://snag.gy/dDvj4P.jpg

Thanks! Adam