Ember 组件：计算 属性 观察本地存储数组

Question

对于 Ember 计算属性应该轻松实现的功能，我有些不知所措。我正在使用 https://github.com/funkensturm/ember-local-storage 来管理本地收藏夹列表。

现在我有一个组件应该显示 object 的状态，以及用于切换收藏夹状态的臭名昭著的 "star" 按钮。

我的组件代码如下：

import Ember from 'ember';
import FavoritesLocal from 'my-app/models/favorites-local';

export default Ember.Component.extend({

    storedFavorites: FavoritesLocal.create(),

    isFavorite: Ember.computed('storedFavorites', function () {
        return this.get('storedFavorites').contains(this.model.get('id'));
    }),

    actions: {
        toggleFavorite() {
            if(this.get('isFavorite')) {
                this.get('storedFavorites').removeObject(this.model.get('id'));
            } else {
                this.get('storedFavorites').addObject(this.model.get('id'));
            }
        }
    }

});

模板包含一个

{{#if isFavorite}}
  <a {{action 'toggleFavorite'}} href="#"></a>
{{else}}
  <a {{action 'toggleFavorite'}} href="#"></a><
{{/if}}

local-storage 的模型很简单

import StorageArray from 'ember-local-storage/local/array'

export default StorageArray.extend({
    storageKey: 'myFavorites'  
});

现在，我当然希望组件在单击按钮时更新。

我的具体问题是关于计算的 属性 究竟应该观察什么。粗略地尝试监听 storedFavorites 属性（见上文）的变化失败了。

显然，我可以向控制器发送一个动作，让它处理并更新模板，但这似乎有点过头了？我错过了什么？

谢谢！

Answer 1

我还没有处理过这个，但我猜你想观察 storedFavorites.length。