Question

我想以不同的方式改变我的模型。

现在就是这样：

App.Invoice = DS.Model.extend({
  title       : DS.attr('string'),
  quantity    : DS.attr('string'),
  total       : DS.attr('string')
});

App.Invoice.FIXTURES = [
 {
   id: 1,
   title: 'Invoice',
   quantity: null,
   total: null
 }
];

在我的模板中，这就是我展示它们的方式

 <td>{{input value=title}}</td>
 <td>{{input value=quantity}}</td>

和

  <p>Title: {{title}}</p>
  <p>Quantity:{{quantity}}</p>

您可以看到here正在运作

我现在想要一个不同的结构

App.Invoice = DS.Model.extend({
  title         : DS.attr('string'),
  transactions  : DS.hasMany('transaction')
});

App.Transaction = DS.Model.extend({
  quantity: DS.attr('string'),
  total: DS.attr('string'),
  invoice: DS.belongTo('invoice')
});

App.Invoice.FIXTURES = [
 {
   id: 1,
   title: 'Invoice'
 }
];

App.Transaction.FIXTURES = [
 {
   id:1,
   quantity: '100',
 }
];

问题是如何在我的模板中显示它们？

Here我的尝试是没有成功的

Answer 1

首先，您使用的Ember-Data非常老，beta-2。我已将其更新为目前的测试版，测试版为-11。

我已将FIXTURES更新为当前语法并添加了与示例数据的关系。我删除了

App.Invoice.reopenClass({
  FIXTURES: [
     {
       id: 1,
       title: 'Invoice',
       transactions: [1]
     }
  ]
});

App.Transaction.reopenClass({
  FIXTURES: [
     {
        id: 1,
        quantity: '100'
     }
    ]
});

您需要在路线中获取模型，如下所示：

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return this.store.find('invoice');
  }
});

然后你可以在模板中迭代它。不要忘记你的主要插座。

<script type="text/x-handlebars">
  {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="index">
  {{#each model}}
    <h1>{{title}}</h1>
    {{#each transactions}}
      <p>Quantity: {{quantity}}
    {{/each}}
  {{/each}}
</script>

您可以看到一个有效的例子here。

模型夹具ember加载到模板中

1 个答案: