0

我有一个两页的 Ember.js 应用程序,它使用 ember-data 来包装一个简单的 RESTful API。主页是产品列表,另一个页面是一个产品的产品详细信息页面。数据通过只有“索引”请求的 API 加载,/api/products.

通过主页导航网站时,上述方法工作正常,但我不确定如何最好地处理直接导航到产品详细信息页面。我需要 ember-data 来请求所有产品并将这些产品保留在客户端,以便当用户浏览简单站点时,它不会再向产品 API 发出任何请求。但是,我的应用程序中的 ProductIndexView 和 ProductIndexController 最好只看到一条记录。

在 Ember.js 中是否有处理这个问题的好方法?我知道我可以将计算属性添加到过滤完整列表的控制器中,然后将其传递到视图模板中。但是,我宁愿视图和控制器不知道完整列表。

4

1 回答 1

2

您需要将所有路线嵌套在可获取所有产品的资源中。

像这样的东西:

App.Route.map(function() {
  this.resource('products', { path: '/' }, function() {
    this.route('index');
    this.resource('product', { path:'/:product_id'} );
  });
});

App.ProductsRoute = Ember.Route.extend({
  model: function() {
    return App.Product.find({});
  }
});

App.ProductsIndexRoute = Ember.Route.extend({
  model: function() {
    return this.modelFor('products');
  };
});

使用products/index模板显示所有产品。

使用product模板显示产品详细信息。

注意{}I 包含在App.Product.find({}). 这会强制 ember-data 返回一个承诺。这对于使product路由在被调用之前等待所有products从服务器到达是必要的。

于 2013-03-06T08:57:10.380 回答