如何在 Ember 中仅将 model[0] 从模板传递给组件?

Question

我只想将模型[0](第一个数据元素(传递给模板中的组件。我有一个路由文件，如下所示：

/order.js
export default Route.extend({
firstIndex: computed('data', {
get(){
return Ember.get(this,'data[0]');
}
}),
model(params) {
return fetch(`/api/salesrowmodel/${params.order_id}`)
.then(resp => resp.json())
.then(function(data) {
return {
data,
};
});
},
}); 

FirstIndex 是一个计算属性，用于返回数组的第一个索引数据。现在在模板中，我想将第一个索引数据传递给组件：

/order.hbs
<div class="Revenue-values">{{order-detail data=firstIndex.revenueHeader}}</div>

我的示例模型数据如下：

[{
"OrderId": "406-5309498-5972326",
"revenueHeader": {
"Principal": 982.14,
"Product Tax": 117.86,
"Total": 1100
}},
{
"OrderId": "506-5234568-5934567",
"revenueHeader": {
"Principal": 382.54,
"Product Tax": 34.46,
"Total": 234
}}]

它显示空或未定义的对象正在传递给订单详细信息。请帮助我解决此错误。

Answer 1

首先，模板不是绑定到路由，而是绑定到控制器。因此，您需要将计算属性移动到控制器。

下一个Ember.get(this,'data[0]');无效。 不能使用Ember.get访问数字属性，因此不能访问数组元素。依赖键computed('data',可能也应该computed('data.[]',。

但是，有一种更简单的方法：

{{order-detail data=model.firstObject}}

因为余烬将firstObject和lastObject添加到数组中。