Question

我正在建立一个订购咖啡的应用程序。在其中一条路线上，我有商店菜单，其中包含一系列具有类型，大小，价格属性的饮品。因此，例如12盎司的摩卡可能会花费5.00美元。

我在构建这些数据时遇到了麻烦并且显示了我的思考方式，也许我并没有以“贪婪的方式”思考，因为我是新手，并且总的来说是前端开发。

在我的路线中，我尝试了几种不同的东西。我有一个'商店 - 饮料'模型，它返回商店的所有饮料。我已经尝试使用它作为我的模型，并且能够在我的模型中返回所有商店饮料，但是很难在表格中显示所有饮料，因为没有像{{if drink.type == 'Mocha'}}这样的内置帮助器。 / p>

我尝试过的另一件事是使用Ember.RSVP.hash分离路线中的饮料，然后在我的模板中安装Ember Truth Helpers以确定每种饮品的大小。

// routes/menu.js
model: function() {
  // get the drinks for the current store, for now hardcode
  const storeId = 4;

  return Ember.RSVP.hash({
    mochas: this.store.find(
      'store-drink', {'store':storeId, 'type':'Mocha'}),
    espressos: this.store.find(
      'store-drink', {'store':storeId, 'type':'Espesso'}),
  })
},
setupController: function(controller, model) {
  controller.set('mochas', model.mochas);
  controller.set('espressos', model.espressos);
}

//menu.hbs
{{#each drink in mochas}}
  {{if (eq drink.type 'Mocha')}}
    <h2>mochas</h2>
    {{drink.type}}
  {{/if}}
{{/each}}

我不仅得到了控制器中'mochas'对象中返回的所有饮料，而且我似乎也无法获得已安装的帮助器。

有什么建议吗？也许我应该有一个完全不同的方法，或者我只是错过了一些东西。

我正在使用ember 1.13

Answer 1

我还没有使用过ember-truth-helper，但查看文档不应该是：

{{#each drink in mochas}}
  {{#if (eq drink.type 'Mocha'}}}
    <h2>mochas</h2>
    {{drink.type}}
  {{/if}}
{{/each}}

您还写了{{item.type}}而不是{{drink.type}}。虽然现在您已经查询了摩卡咖啡饮料，但您应该能够摆脱if。离开：

{{#each drink in mochas}}
  <h2>mochas</h2>
  {{drink.type}}
{{/each}}

对于find，它只是向后端发送一个GET，后端负责返回的内容。如果你想过滤到位：

this.store.find('store-drink', {'store':storeId}, function(drink) {
  return drink.type === 'Mocha';
});

表EmberJS中的结构化数据

1 个答案: