New Twiddle

components.ddau-it.js

import Ember from 'ember';

const { computed, get, set } = Ember;

export default Ember.Component.extend({
  toChange: undefined,
  saved: undefined,
  
  model: undefined,
  
  specificItem: computed.alias('shadowModel.0.items.0.quantity'),
  
  _total: computed('shadowModel.@each.itemSum', function() {
    const groups = get(this, 'shadowModel');
    const toSum = (sum, group) => sum + get(group, 'itemSum');
    return groups.reduce(toSum, 0);
  }),
  anySet: computed.bool('_total'),
  isDisabled: computed.not('anySet'),
  firstGroupSum: computed.alias('shadowModel.0.itemSum'),
  
  didReceiveAttrs() {
    const model = get(this, 'model');
    
    const groups = [].concat(model)
      .map(group => ({
        ...group,
        itemSum: computed('items.@each.quantity', function() {
        	const toSum = (sum, item) => sum + parseInt(get(item, 'quantity'));
          return get(group, 'items').reduce(toSum, 0);
        }),
      }));

    set(this, 'shadowModel', groups);
  },
  
  actions: {
    setNested(value) {
      set(this, 'saved', value);
      set(this, 'model.0.items.0.quantity', value);
    }
  }
});

controllers.application.js

import Ember from 'ember';

const { computed, get, set } = Ember;

export default Ember.Controller.extend({ 
  toChange: undefined,
  saved: undefined,
  
  model: [
    {
      items: [
        { quantity: 0 },
        { quantity: 0 },
      ]
    },
    {
      items: [
        { quantity: 0 },
        { quantity: 0 },
      ]
    },
  ],
  
  actions: {
    update(value) {
      set(this, 'model.0.items.0.quantity', value);
    }
  }
});

templates.application.hbs

<h3>How do things update, eh?</h3>

{{ddau-it model=model}}

templates.components.ddau-it.hbs

<form>
  {{input value=toChange action=(mut toChange)}}
  <button type='submit' {{action 'setNested' toChange}}>
    Save it!
  </button>
</form>

<div>saved: {{saved}}</div>
<div>_total: {{_total}}</div>
<div>anySet: {{anySet}}</div>
<div>specificItem: {{specificItem}}</div>
<div>isDisabled: {{isDisabled}}</div>
<div>firstGroupSum: {{firstGroupSum}}</div>

twiddle.json

{
  "version": "0.11.0",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.10.2",
    "ember-data": "2.11.0",
    "ember-template-compiler": "2.10.2",
    "ember-testing": "2.10.2"
  },
  "addons": {}
}