在我的Ember应用程序中,我使用从Discourse联合创始人的博客文章http://eviltrout.com/2013/02/27/adding-to-discourse-part-1.html复制的ajax调用获得所有餐馆的列表
App.Restaurant.reopenClass({
findAll: function() {
return $.getJSON("restaurants").then(
function(response) {
var links = Em.A();
response.restaurants.map(function (attrs) {
links.pushObject(App.Restaurant.create(attrs));
});
return links;
}
);
},
我有一个餐馆路线设置调用上面显示的findAll并将其呈现到应用程序模板
App.RestaurantsRoute = Ember.Route.extend({
model: function(params) {
return(App.Restaurant.findAll(params));
},
renderTemplate: function() {
this.render('restaurants', {into: 'application'});
}
});
餐厅显示为restaurants
这样的模板,其中包含指向每个餐厅的链接。我还添加了restaurant
模板
<script type="text/x-handlebars" id="restaurants">
<div class='span4'>
{{#each item in model}}
<li> {{#link-to 'restaurant' item}}
{{ item.name }}
{{/link-to }}</li>
{{/each}}
</ul>
</div>
<div class="span4 offset4">
{{ outlet}}
</div>
</script>
在Ember路由器中,我设置了这样的父/子路由
this.resource("restaurants", function(){
this.resource("restaurant", { path: ':restaurant_id'});
});
因此,我希望当我点击餐馆列表中某个特定餐厅的链接时,它会将此restaurant
模板插入outlet
中定义的restaurantS
}(复数)模板
<script type="text/x-handlebars" id="restaurant">
this text is getting rendered
{{ item }} //item nor item.name are getting rendered
</script>
此餐厅模板正在呈现,但item
的数据未显示。
当我点击列表中的{{#link-to 'restaurant' item}}
时,item
代表该餐馆。
在此设置中,Ember是否需要进行另一个ajax调用以检索该特定项目,即使它已经从findAll
调用加载了?
如果我确实需要查询单个餐厅(再次),我为个别餐厅创建了一条新路线
App.RestaurantRoute = Ember.Route.extend({
model: function(params) {
console.log(params);
console.log('resto');
return App.Restaurant.findItem(params);
}
});
和餐厅模型上的findItem
App.Restaurant.reopenClass({
findItem: function(){
console.log('is this getting called? No...');
return 'blah'
}
但是这些console.log都没有被调用。
在Ember首发视频https://www.youtube.com/watch?v=1QHrlFlaXdI中,当Tom Dale点击列表中的博客帖子时,帖子会显示在为其定义的模板中,而不需要他做任何事情而不是设置路线(因为我(以及)帖子模板中的{{outlet}}以接收帖子。
在这种情况下,你能理解为什么这对我不起作用吗?
答案 0 :(得分:0)
当您导航到restaurant
路线时,item
将成为此路线的model
。
因此,在您的模板中,如果您尝试
<script type="text/x-handlebars" id="restaurant">
this text is getting rendered
{{ model.name }}
</script>
您将能够看到餐厅的名称
并且还没有调用模型钩子,并且进一步的console.log
不起作用,
因为
注意:具有动态段的路径只有在通过URL输入时才会调用其模型钩子。如果通过转换输入路线(例如,当使用链接到Handlebars帮助器时),则已经提供了模型上下文并且不执行钩子。没有动态段的路由将始终执行模型挂钩。
希望现在一切都会清楚。