Как правильно emberjs переключаться между различными вариантами фильтрации? - PullRequest
Новая
       6

Как правильно emberjs переключаться между различными вариантами фильтрации?

4 голосов
/ 28 марта 2012

У меня индивидуальный магазин (происходит от 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()

});

В моем представлении есть "индивидуальная привязка: 'App.individualStore.allIndividuals', которая отображается в идеальном виде.* Я хочу добавить кнопки фильтрации, например Show: All | Alive | Deceased.Что будет правильным способом изменить фильтрацию здесь?Имейте в виду, что какими бы ни были критерии, я бы хотел, чтобы он всегда был синхронизирован с IndividualStore.

Кто-то предложил изменить привязки во время выполнения, 

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

Это работает в моем первомдва-три нажатия на эти кнопки, но затем браузер зависает (что-то вроде бесконечного цикла?).

Для меня это тоже не лучший вариант.Я новичок в Ember, поэтому все, что вы скажете, будет полезно.Заранее спасибо.

1 Ответ

7 голосов
/ 28 марта 2012

Я бы сделал функцию фильтра самой по себе свойством, и, изменив 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), чтобы вы могли, например, фильтровать всех живых людей определенного возраста, ...

...