binding - 在各种过滤选项之间切换的正确 emberjs 方式是什么？

Question

我有一个 individualStore(从 Em.ArrayController 扩展)，它的任务是保存一个单独的对象数组。我的应用程序调用了几个 API，它们返回发送到商店的各个对象。将其视为我的应用程序中缓存的单个记录的数据库。

App.individualStore = App.ArrayController.create({

  allIndividuals: function () {
    return this.get('content').sort(function (a, b) {
      return (b.votes_count - a.votes_count);
    });
  }.property('@each.votes_count').cacheable(),

  aliveIndividuals: function () {
    return this.get('content').filter(function (individual) {
      return (!!individual.living);
    }).sort(function (a, b) {
      return (b.votes_count - a.votes_count);
    });
  }.property('@each.living', '@each.votes_count').cacheable(),

  deceasedIndividuals: function () {
    return this.get('content').filter(function (individual) {
      return (!individual.living);
    }).sort(function (a, b) {
      return (b.votes_count - a.votes_count);
    });
  }.property('@each.living', '@each.votes_count').cacheable()

});

我的观点有一个`individualsBinding: 'App.individualStore.allIndividuals'，它完美地呈现了预期。

我想添加过滤按钮，例如 Show: All | Alive | Deceased .在这里更改过滤的正确方法是什么？请记住，无论标准是什么，我都希望它始终与 individualStore 保持同步。

有人建议在运行时更改绑定(bind)，

this.bind('users', Ember.Binding.from('App.individualStore.aliveIndividuals'));

这在我前两三次单击这些按钮时有效，但随后它卡住了浏览器(有点无限循环？)。

这对我来说也不是最好的选择。我是 ember 的新手，所以你说的任何内容都会有所帮助。提前致谢。

Answer 1

我会让过滤器函数本身成为一个属性，并通过更改 filterName在 Controller 上，您会收到通知并相应地更新过滤后的内容，请参阅 http://jsfiddle.net/pangratz666/ypcLq/

App.controller = Ember.ArrayProxy.create({
    content: [],

    filterName: 'all',

    allFilter: function() {
        return true;
    },
    aliveFilter: function(individual) {
        return ( !! individual.living);
    },
    deceasedFilter: function(individual) {
        return (!individual.living);
    },

    filtered: function() {
        var filterName = this.get('filterName');
        var filterFunc = this.get(filterName + 'Filter');

        return this.filter(filterFunc).sort(function(a, b) {
            return (b.votes_count - a.votes_count);
        });
    }.property('content.@each', 'filterName').cacheable()

});

因此，您稍后可以在 View 中设置应通过 App.controller.set('filterName', 'alive') 使用的过滤器.

请注意:您可以通过 this.filter(filterFunc1).filter(filterFunc2) 链接过滤器因此，您可以例如过滤特定年龄的所有活着的人，...