什么是在各种过滤选项之间切换的正确的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()

});

我的观点有一个`individualBinding:'App.individualStore.allIndividuals',它按照预期完美呈现.

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

有人建议在运行时更改绑定,

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

这在我对这些按钮的前两次三次点击中有效,但随后会冻结浏览器(有点无限循环？).

这对我来说也不是最好的选择.我是新来的,所以你说的任何东西都会有所帮助.提前致谢.

Answer 1

我会将过滤器函数本身作为属性,通过更改filterName控制器上的内容,您会收到通知并相应地更新过滤后的内容,请参阅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()

});

因此,您可以稍后在视图中设置要通过的过滤器App.controller.set('filterName', 'alive').

就像一个注释:你可以链接过滤器,this.filter(filterFunc1).filter(filterFunc2)所以你可以例如过滤所有特定年龄的活着的人,...