无法在 Ember.js 中观察对象数组？答案

【问题标题】：Unable to observe an array of objects in Ember.js?无法在 Ember.js 中观察对象数组？
【发布时间】：2016-04-29 20:00:21
【问题描述】：

我在这样的组件中有一个对象数组：

checkboxes: [
    {
        label: 'A',
        state: false
    },
    {
        label: 'B',
        state: false
    },
    {
        label: 'C',
        state: false
    }
]

在我的 Handlebars 模板中，我有一个循环来显示复选框列表，并且每个复选框状态映射回数组项，如下所示：

{{#each checkboxes as |item|}}
    <li><input type="checkbox" checked={{item.state}}> {{item.label}}</li>
{{/each}}

我写了一个观察者来观察数组的变化，但它似乎不起作用：

observeCheckboxes: function() {
    console.log(this.get('checkboxes').toArray());
}.observes('checkboxes.[]')

如何观察复选框状态的变化，以便获得选中项目的列表？

【问题讨论】：

标签： javascript ember.js

【解决方案1】：

将你的观察者改为观察checkboxes.@each.state。

查看文档here 以获得完整概述。

如果可能，尽量避免使用观察者，而是使用计算属性，然后将计算属性和观察者定义为 Ember.computed 和 Ember.observer。

这是一个twiddle，它说明了为什么您的观察者没有触发。

【讨论】：