在Ember.js中显示数组中的3个项目
在Ember.js中显示数组中的3个项目
提问于 2014-08-11 23:49:43
我有一个用于Ember.js的数据源，其中包含几个项。
我可以这样做：
{{each controller}}
{{name}}
{{/each}}来显示来自此来源的所有名称，并且它可以工作。
现在我只想显示其中的3个，但由于每个项目的模板略有不同，我希望能够这样做：
<h1>{{name of first item}}</h1>
<h2>{{name of second item}} </h2>
<h3>{{name of third item}}</h2>如何用Ember.js实现？
回答 3
Stack Overflow用户
回答已采纳
发布于 2014-08-12 04:07:35
作为基础，我会尝试做一些更多的事情。
Ember.ArrayController.extend({
limitedContent: function(){
return this.get('content').slice(0, 3);
}.property('content.[]'),
sortProperties: ['color'],
sortAscending: false,
})然后你可以做的就是遍历limitedContent。您可以通过设置动态限制来使其可扩展，如果您想要更改它的排序方式，它仍然有效。我以一种非常类似的方式处理分页。如果您想要正确地处理排序，则需要将内容改为arrangedContent。
这是一个显示这一点的jsbin：JSBIN
Stack Overflow用户
发布于 2014-08-12 01:48:00
如果你只想拉出三个项目，你可以为每个项目创建一个计算属性：
App.IndexController = Ember.ArrayController.extend({
firstItem: function() {
return this.get('model').objectAt(0);
}.property('model'),
secondItem: function() {
return this.get('model').objectAt(1);
}.property('model'),
thirdItem: function() {
return this.get('model').objectAt(2);
}.property('model')
});下面是一个完整的示例：
http://emberjs.jsbin.com/fibaha/1/edit?html,js,output
http://emberjs.com/api/classes/Ember.Array.html#method_objectAt
Stack Overflow用户
发布于 2018-06-08 04:37:54
您可以使用ember-composable-helpers: object-at helper来完成此操作
{{object-at index array}}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25247307
复制相关文章
相似问题