将模型中的数据填充到车把模板中

时间:2015-01-25 00:49:56

标签: ember.js

我有以下路径从服务器返回json resoponse。

    myApp.VcustomersInvoiceRoute = Ember.Route.extend({
  queryParams: {
    order_id: {
      refreshModel: true
    }
  },
  model: function(params) {
    var url = 'ajax_handler/getorderdetails/' + params.order_id;

    return Ember.$.getJSON(url)
  },
   setupController: function(controller, model) {
        this._super(controller, model);
    controller.set('model', model);
  }
});

服务器响应:

[{"id":"1929","firstname":"Aaron","lastname":"Loeb","dayphone":"650 - 346 - 8668","email":"aaronloeb@gmail.com","street":null,"city":null,"zipcode":null,"pickuptime":"02:00:00","pickupdate":"02:00:00","location":"4th Street","type":"Web order"}]

控制器:

    myApp.VcustomersInvoiceController = Ember.ObjectController.extend({

    adding:false,
    isEditing:false,
  actions: {
        editorederdetails: function() {
            this.set('isEditing', true);

        },
        isadding: function() {
            if (this.adding){
                    this.set('adding', false)
                    $("#add").show();
                }else{
                    this.set('adding', true)
                    $("#add").hide();
                };

        },
    },
});

我想要实现的是将此响应中的数据显示到模板中。类似的东西:

<script type="text/x-handlebars" data-template-name="vcustomers/invoice">

<h1>Invoice <small># {{id}}</small></h1>
<h1>Customer <small># {{lastname}}</small></h1>

路线结构:

myApp.Router.map(function() {
this.resource('vcustomers', function () {
    this.route('invoice', { path: '/invoice/:invoice_id' });
});
this.resource('vmenus');
this.resource('creport');

});

1 个答案:

答案 0 :(得分:2)

您需要将一个对象(而不是内部有一个对象的数组)传递给控制器​​。然后,您可以轻松访问其属性。将您的setupController方法更改为:

setupController: function(controller, model) {
  this._super(controller, model);
  controller.set('model', model.get('firstObject'));
}

然后您可以使用以下方式访问模型属性:

<h1>Invoice <small># {{model.id}}</small></h1>
<h1>Customer <small># {{model.lastname}}</small></h1>

产生:

Invoice # 1929

Customer # Loeb

Working demo.