ember.js - 如何观察 Ember.Object 中的 Array 字段？

Question

我有这段代码(http://jsfiddle.net/stephane_klein/gyHmS/2/):

App = Ember.Application.create({});

App.Item = Ember.Object.extend({
    title: null,
    parent: null
});

App.MyList = Ember.Object.extend({
    title: null,
    content: [],
    changed: function() {
        console.log('here');
    }.observes('content')
});

App.list = App.MyList.create({
    title: "foobar",
    content: [
        App.Item.create({
            item: "item1"
        }),
        App.Item.create({
            item: "item2"
        })
    ]
});
console.log(App.list.content);

App.list.content.pushObject(
    App.Item.create({
        item: "item3"
    })
);
console.log(App.list.content);

为什么从不调用“console.log('here')”？

当 App.Item 插入 App.MyList 时，我想设置 App.Item.parent。我不知道如何观察 App.MyList.content 字段。

感谢您的帮助。

最好的问候，斯蒂芬

Answer 1

您没有更改内容属性，您只是将一个对象插入其中。您有两个解决方案:

• 您可以观察每一项内容(使用.observes('content.@each'))，但注意，该方法可能会被多次调用
• 或手动通知此属性已更改(使用 this.notifyPropertyChange('content'))

这是第一个解决方案:jsfiddle using @each

这是第二个解决方案:jsfiddle using notifyPropertyChange

您还必须注意，您不应直接使用 App.list.content，而应使用 App.list.get('content')。看看this article written by Roy Daniels如果您需要更多信息。

编辑

请注意 @each 的使用略有变化。 Ember.Array#@each documentation说:

Returns a special object that can be used to observe individual properties on the array. Just get an equivalent property on this object and it will return an enumerable that maps automatically to the named key on the member objects.

If you merely want to watch for any items being added or removed to the array, use the [] property instead of @each.

让我们看一个例子:

App.Post = Ember.Object.extend({
  createdAt: null
});

App.Blog = Ember.Object.extend({
  posts: null,

  init: function() {
    this._super();
    this.set 'posts', [];
  },

  newerPost: function() {
    return this.get('posts').sortBy('createdAt').get('firstObject');
  }.property('posts.@each.createdAt'),

  postsCount: function() {
    return this.get('posts.length');
  }.property('posts.[]')
});

newerPost 需要观察每个 posts 的特定属性，而 postsCount 只需要知道 posts > 阵列变化。