Javascript 如何构建动态过滤

我有一个可以排序、过滤和查询的项目列表

对它们进行排序非常简单：

var ToDoList = Ember.Object.extend({
  // using standard ascending sort
  todosSorting: ['name:desc'],
  sortedTodos: Ember.computed.sort('todos', 'todosSorting')
});

然后，您可以轻松地将

todosorting

的值更改为，例如

['name:asc']

或每个todo的名称。EmberJS魔法可以解决一切问题。您甚至可以将

todosorting

更改为todos的另一个属性，这样就可以了

过滤功能似乎没有那么强大。您可以给出一个函数或一个键加值。它不像sort那样强大。您可以更改每个todo的filtered属性，列表将被过滤。但是如何更改过滤器的值或键呢

是否有一种方法可以实现与

.sort（）

相同级别的灵活性

e、 g:

目前，我是这样实现的：

var ToDoList = Ember.Object.extend({
  currentFilter: 'all',
  filterBy: Ember.computed('currentFilter', function() {
    return this.filters[this.get('currentFilter')];
  }),

  filters: {
    all: function(item) {
      return true;
    },

    priority1: function(item) {
      return item.get('priority') === 1;
    },

    priority2: function(item) {
      return item.get('priority') === 2;
    },
  }

  filteredTodos: Ember.computed('todos', 'filterBy', 'todos.@each.priority', function () {
    return this.filter();
  }),

  filter: function() {
    return this.get('todos').filter(function(todo) {
      return this.get('filterBy')(todo);
    }.bind(this));
  },
});

---

如果您有多个筛选可能性，则此功能无法很好地扩展

您可以使用多种不同的方法编写此功能。与

sort

不同，

filter

和

filterBy

API不提供按给定键和值进行动态筛选的方法。但您可以使用以下代码为自己实现该API：

var filterByKeyAndValue = function filterByKeyAndValue(items, key, value) {
  return items.filter(function (item) {
    return Ember.get(item, key) === value;
  });
};

var ToDoList = Ember.Object.extend({

  currentPriority: null,

  filteredTodos: Ember.computed('todos', 'todos.@each.priority', 'currentPriority', function() {
    if (!this.get('currentPriority')) {
      // slice ensures we consistently return a new Array.
      return this.get('todos').slice();
    }

    return filterByKeyAndValue(this.get('todos'), 'priority', this.get('currentPriority'));
  }),

});

这有用吗

---

我已经在这里硬编码了这个键（

'priority'

），但是当然，您也可以将其分解到Ember.Object中。

有许多不同的方法可以编写它。与

sort

不同，

filter

和

filterBy

API不提供按给定键和值进行动态筛选的方法。但您可以使用以下代码为自己实现该API：

var filterByKeyAndValue = function filterByKeyAndValue(items, key, value) {
  return items.filter(function (item) {
    return Ember.get(item, key) === value;
  });
};

var ToDoList = Ember.Object.extend({

  currentPriority: null,

  filteredTodos: Ember.computed('todos', 'todos.@each.priority', 'currentPriority', function() {
    if (!this.get('currentPriority')) {
      // slice ensures we consistently return a new Array.
      return this.get('todos').slice();
    }

    return filterByKeyAndValue(this.get('todos'), 'priority', this.get('currentPriority'));
  }),

});

这有用吗

我已经在这里硬编码了这个键（

'priority'

），但是当然，您也可以将其分解到Ember.Object中