javascript - EmberJS 中 find() 和 filter(function(){return true;}) 的区别

Question

我正在制作一个简单的餐厅菜单。我需要根据我们当前所在的类别过滤菜肴列表。问题出在 this.store.filter(...) 方法的奇怪行为中。它不返回任何东西...

我想这样使用它:

App.DishRoute = Ember.Route.extend({
  model: function (param) {
    return this.store.filter('dish', function(dish) {
      return dish.get('category_id') == param.category_id;
    });
  }
});

但出于测试目的，我在此处的示例中使用了 this.store.filter('dish', function() {return true;}); http://jsbin.com/AcoHeNA/43/ .

请检查代码并告诉我我做错了什么或告诉我应该如何过滤数据。

Answer 1

store.filter 不查询服务器，它只是过滤存储中已经加载的数据。在您的情况下，因为您在任何时候都不加载数据，过滤器将返回空结果。您可以修复它调用 this.store.find('dish'); 从服务器加载数据，因此任何 filter('dish', ...) 都会得到更新。

App.DishRoute = Ember.Route.extend({
  model: function (param) {
    console.log(param.dish_id);

    // pre load the data
    this.store.find('dish');
    // filter the prefetch data, when update the filter when new data are loaded
    return this.store.filter('dish', function(){return true;});    
  }
});

这是更新后的 jsbin http://jsbin.com/akeJOTah/1/edit

这是最常用的存储方法的概述:

1. store.find('dish') => 使用/disishes 发送请求
2. store.find('dish', 1) => 使用/dishes/1 发送请求
3. store.find('dish', { name: 'some' }) => 发送请求/dishes?name=some
4. store.filter('dish', function() { ... }) => 客户端过滤，不发送请求，只过滤存储中存在的数据
5. store.filter('dish', function() { ... }, { foo: 'bar' }) => 使用查询运行查找(第 3 项)并执行客户端过滤
6. store.all('dish') => 不发送请求，只获取存储中加载的所有数据