Observing nested objects properties in ArrayProxy fails when using @each, works with explicit index

[e00dan]

Observing nested objects properties in ArrayProxy fails when using @each, works with explicit index like 0.

Having ArrayProxy:

testData: Ember.ArrayProxy.create({
    content: [
      Ember.Object.create({
        secondValue: testObj.create({
          val: true
        })
      })
  ]

This fires correctly when property changes (using concrete index - 0 and content):

arrayChangedExplicitly: Ember.observer('testData.content.0.secondValue.val', function () {
    console.log('Array changed with 0 index explicitly');
}),

This doesn't (using each and content):

arrayChangedEach: Ember.observer('[email protected]', function () {
    // this does not work!
    console.log('Array changed with each');
}),

Neither:

arrayChangedEachNoContent: Ember.observer('[email protected]', function () {
    // this does not work!
    console.log('Array changed with each');
})

Using Ember version:

DEBUG: -------------------------------
DEBUG: Ember  : 2.1.0-beta.3
DEBUG: jQuery : 1.11.1
DEBUG: -------------------------------

1. SEE DEMO ON JSBIN.
2. Open dev tools and console F12
3. Toggle checkbox by clicking on it
4. Following will be logged:

Array changed with 0 index explicitly - from array nested objects observer
valChanged observer in object - from observer in object

Issue is that:

Array changed with @each

isn't logged, and using @each in observing objects properties in ArrayProxy doesn't work.

[devinus]

I believe this might be related: #12329

[e00dan]

Yes, I also thought of referencing this issue in your issue.

[pixelhandler]

@kuzirashi I don't believe observing nested properties are supported '[email protected]' but instead only '[email protected]' is supported (but that should be property of the object not a object itself.

See: http://guides.emberjs.com/v1.13.0/object-model/computed-properties-and-aggregate-data/

Note that @each only works one level deep. You cannot use nested forms like [email protected] or [email protected][email protected].

[stefanpenner]

Note that @each only works one level deep. You cannot use nested forms like [email protected] or [email protected][email protected].

this is actually meant to say you cant do. [email protected].@each but [email protected] should work.

[krisselden]

Using dependencies [email protected].@each and [email protected] have never been supported by any version of Ember and not covered by any test. Only thing is to work without issue is to decompose into multiple CPs.

[stefanpenner]

Using dependencies [email protected].@each and [email protected] have never been supported by any version of Ember and not covered by any test. Only thing is to work without issue is to decompose into multiple CPs.

[stefanpenner]

i believe @rwjblue is going to be adding a warning