Question

我创建了一个新的ember项目并将其连接到firebase。我正在检索所有帖子，并且显示所有帖子都很好，但我想只显示一个帖子。

我正在使用ember v1.13.11

模型 - app / models / post.js：

import Ember from 'ember';
import DS from 'ember-data';

let {
  Model,
  attr
} = DS;

export default Model.extend({
  title: attr('string'),
  createdDate: attr('date'),
  text: attr('string'),
  imgURL: attr('string')
});

路线 - app / routes / index.js：

import Ember from 'ember';

export default Ember.Route.extend({
	model(){
		return this.store.findAll('post');
	}
});

template - app / templates / index.hbs：

{{#each model as |post|}}
<div class="panel panel-default">
	<div class="panel-heading">
		{{post.title}}
	</div>
	<div class="panel-body">
	<p>{{post.text}}</p>
	<br />
	<img src="{{post.imgURL}}">
	</div>
</div>
{{/each}}

一切正常。但是我要显示一个特定的帖子。我认为这会奏效，但我错了。

<div class="panel panel-default">
    	<div class="panel-heading">
    		{{post.1.title}}
    	</div>
    	<div class="panel-body">
    	<p>{{post.1.text}}</p>
    	<br />
    	<img src="{{post.1.imgURL}}">
    	</div>
    </div>

// OR

<div class="panel panel-default">
    	<div class="panel-heading">
    		{{post.[1].title}}
    	</div>
    	<div class="panel-body">
    	<p>{{post.[1].text}}</p>
    	<br />
    	<img src="{{post.[1].imgURL}}">
    	</div>
    </div>

有什么想法吗？

Answer 1

你有很多选择，就是在路线上做这件事

model() {
  return this.store.findAll('post');
},

setupController(controller, model) {
  controller.set('post', model.get('firstObject'));
}

只用一个帖子准备控制器

另一个选项是在控制器中创建一个计算出的属性

import Ember from 'ember';

export default BaseController.extend({
  onePost: Ember.computed('posts',function(){
    return this.get('posts.firstObject');
  })
}

并在你的handlbars模板中引用onePost

{{onePost.title}}

我想我更喜欢这个选项

@OllieT对不起，我以为你已经修好了，计算机在你的组件中，你也可以在模型中放置计算属性，但这不是你现在想要的。因此，只需将计算属性添加到您接收模型组件或控制器的位置，然后您就应该能够显示它。您的“模型”是return this.get('putYourModelHere')中的内容，可以清除return this.get('putYourModelHere').get('firstObject')与return this.get('putYourModelHere.firstObject')相同的内容，甚至可以将{{posts.firstObject}}放入旧版本中模板，你很高兴

Answer 2

您实际上可以在模板中使用firstObject方法。

因此，如果您的控制器的模型是一堆帖子，并且您想要显示其中第一个帖子的标题，则可以在该控制器的模板中写下：

{{model.firstObject.title}}

通常，如果您在/posts之类的路线中并且想要查看ID为1的帖子的数据，您将转换到路线/posts/1并在路线中设置该路线的模型作为带有来自网址ID参数的ID的帖子，即posts.show route类似

的内容

model: function (params) {
 return this.get('store').find('post', params.id)
}

然后在模板中，您现在只需参考

{{model.title}}

获取模型中的特定项目

2 个答案: