Question

我刚开始使用ember，如果我使用下面的代码则没有显示任何内容。

我的order_controller.js

Office.OrderController = Ember.Controller.extend({

});

我的customer.handlebars

 {{#each order in orders}}
                    <tr>
                        <td></td>
                        <td>{{order.mode}}</td>
 {{/each}}

我的customer_route.js

Office.CustomerRoute = Ember.Route.extend({
    model: function(params) {
        return Office.Customer.find(params.customer_id);
    },
    setupController: function(controller, model) {
        controller.set('content', model);
    }
});

我的模型是（order.js）

Office.Order = DS.Model.extend({
    mode: DS.attr('string'),
    price: DS.attr('float'),

});

我的序列化程序是order_single_serializer.rb

class OrderSingleSerializer < ActiveModel::Serializer
  attributes :mode, :price
  embed :ids, include: true
end

Answer 1

这是一个我使用DS.FixtureAdapter的简单示例，而不是挑剔您的示例。假设您的响应遵循约定，在将适配器切换到DS.RESTAdapter后，它也适用于您。

Office = Em.Application.create();

Office.Store = DS.Store.extend({
  adapter: "DS.FixtureAdapter"
});

Office.Router.map(function() {
  this.resource("customers", function() {
    this.resource("customer", { path: ":customer_id" });
  });
});

Office.IndexRoute = Em.Route.extend({
  redirect: function() {
    this.transitionTo("customers");
  }
});

Office.CustomersRoute = Em.Route.extend({
  model: function() {
    return Office.Customer.find();
  }
});

Office.OrdersRoute = Em.Route.extend({
  model: function() {
    return Office.Order.find();
  }
});

Office.Customer = DS.Model.extend({
  name: DS.attr("string"),
  orders: DS.hasMany("Office.Order")
});

Office.Order = DS.Model.extend({
  mode: DS.attr("string"),
  price: DS.attr("number")
});

Office.Customer.FIXTURES = [{
  id: 1,
  name: "Stan Smith",
  orders: [1, 2]
}, {
  id: 2,
  name: "Brian Griffin",
  orders: [3, 4, 5]
}];

Office.Order.FIXTURES = [{
  id: 1,
  mode: "abcd",
  price: 12.34
}, {
  id: 2,
  mode: "efgh",
  price: 15.99
}, {
  id: 3,
  mode: "ijkl",
  price: 1.99
}, {
  id: 4,
  mode: "mnop",
  price: 3.49
}, {
  id: 5,
  mode: "qrst",
  price: 9.99
}];

模板：

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

<script type="text/x-handlebars" id="customers">
  {{#each model}}
  <div>
    {{#linkTo "customer" this}}
      {{name}}
    {{/linkTo}}
  </div>
  {{/each}}
  <hr>
  {{outlet}}
</script>

<script type="text/x-handlebars" id="customer">
  <h2>{{name}}</h2>

  <p>Has {{orders.length}} orders</p>
  {{render "orders" orders}}
</script>

<script type="text/x-handlebars" id="orders">
  <h3>Orders</h3>
  {{#each model}}
    <div>{{mode}} - {{price}}</div>
  {{/each}}
</script>

Emberjs和rails has_many和belongs_to

1 个答案: