Ember.js 显示具有多个关系的第一个元素

app/models/product.js

import DS from 'ember-data';

var Product = DS.Model.extend({
  name: DS.attr('string'),
  pictures: DS.hasMany('picture', { async: true })
});

export default Product;

import DS from 'ember-data';

var Picture = DS.Model.extend({
  url: DS.attr('string'),
  alt: DS.attr('string')
});

export default Picture;

app/models/pictures.js

import DS from 'ember-data';

var Product = DS.Model.extend({
  name: DS.attr('string'),
  pictures: DS.hasMany('picture', { async: true })
});

export default Product;

import DS from 'ember-data';

var Picture = DS.Model.extend({
  url: DS.attr('string'),
  alt: DS.attr('string')
});

export default Picture;

在

产品

索引视图中，我可以使用此代码显示所有

图片

：

{{#each picture in product.pictures}}
  <img {{bind-attr src=picture.url}} alt="example">
{{/each}}

{{{#product.pictures}中的每个图片
{{/每个}}

---

如何仅显示第一张

图片

？

以下内容适用于您：

<img src={{product.pictures.firstObject.url}} alt="example">

属性

firstObject

和

lastObject

在Ember中可用

另外请注意，您不再需要使用bind attr