Question

我在尝试显示每个对象都有嵌套对象的对象列表时遇到问题，这些对象中甚至还有另一级别的对象。 API-respons为我提供了这个（简化的）JSON数据，其中有许多货运单：

{
    "freightOrders": [{
        "id": 1,
        "comment": "Freight order comment",
        "shipments": [{
            "id": 1,
            "shipment_lines": [{
                "id": 1,
                "description": "A description",
                "package_weight": 900,
                "package_length": 1200,
                "package_height": 400,
                "package_width": 800
            }],
            "pickup_address": {
                "id": 1,
                "address": "The pickup address",
                "zip": "9000"
            },
            "delivery_address": {
                "id": 2,
                "address": "The delivery address",
                "zip": "8000"
            },
        }],
    }]
}

我想要的是显示所有货运单的清单，并且暂时直接访问每个订单的第一批货运单。在Handlebars我试过

{{#each model as |order|}}
    <span>
        {{order.shipments.0.pickup_address.address}},
        {{order.shipments.0.pickup_address.zip}}
    </span>
{{/each}}

和

{{#each model as |order|}}
    {{#each order.shipments as |shipment|}}
        <span>
            {{shipment.pickup_address.address}},
            {{shipment.pickup_address.zip}}
        </span>
    {{/each}}
{{/each}}

编辑：这是所要求的订单模型：

import DS from 'ember-data';

export default DS.Model.extend({
    comment: DS.attr('string'),
    shipments: DS.hasMany('shipment', { inverse: null })
});

以及良好衡量标准的出货模式：

import DS from 'ember-data';

export default DS.Model.extend({
    pickup_address: DS.belongsTo('address', { inverse: null }),
    delivery_address: DS.belongsTo('address', { inverse: null }),
    shipment_lines: DS.hasMany('shipment-line', { inverse: null })
});

无论我尝试做什么，我都无法访问出货单元或订单对象的任何嵌套对象。

我可以提一下，我也尝试将货件部件作为一个组件创建，并将order.shipments传递给组件，但不会占上风。

搜索SO和谷歌没有透露任何提示只有一些如何在ember 1.x中嵌套的示例

那么，如何在Handlebars和Ember Data中的每个循环中访问嵌套对象？

Answer 1

我不知道我是否获得了足够的信息，但让我们从一个观察开始：

JsonApi规范描述了使用连字符而不是下划线。所以你的有效载荷应该是shipment-lines（等）。 Ember使用JsonApi作为默认值，因此您应该遵循此操作，或使用序列化程序修复它。

例如：

export default DS.JSONAPISerializer.extend({
  keyForAttribute: function(attr, method) {
    return Ember.String.underscore(attr);
  }
});

请注意，ember'理解'下划线应该在模型中大写。您的有效负载可以增强，看起来像[1]：

{
"freightOrders": [{
    "id": 1,
    "comment": "Freight order comment",
    "shipments": [{
        "id": 1,
        "shipment-lines": [{
            "id": 1,
            "description": "A description",
            "package-weight": 900,
            "package-length": 1200,
            "package-height": 400,
            "package-width": 800
        }],
        "pickup-address": {
            "id": 1,
            "address": "The pickup address",
            "zip": "9000"
        },
        "delivery-address": {
            "id": 2,
            "address": "The delivery address",
            "zip": "8000"
        },
    }],
}]
}

您的货件型号：

import DS from 'ember-data';

export default DS.Model.extend({
  pickupAddress: DS.belongsTo('address', { inverse: null }),
  deliveryAddress: DS.belongsTo('address', { inverse: null }),
  shipmentLines: DS.hasMany('shipment-line', { inverse: null })
});

在你的模板中，你应该可以做一个简单的循环：

{{#each model.shipments as |shipment|}}
  <span>{{shipment.pickupAddress.address}}</span>
{{/each}}

[1]如果您在有效负载中使用attributes和relations与JSON API完全兼容，那就更好了，有关详细信息，请参阅：http://jsonapi.org/

Ember数据以及Handlebars中的每个循环和嵌套对象

1 个答案: