[英]ember nested route not loading
Just trying to determine how to do this. 只是试图确定如何执行此操作。 For an image sharing site I have the following requirement.
对于图像共享网站,我有以下要求。
this is my router.js: 这是我的router.js:
this.resource('image', function(){
this.route('index', {path:'/:image_id'});
this.route('comments', {path:'/image_id/comments'});
});
template/image/index.hbs: 模板/图像/ index.hbs:
<div class="container">
{{partial "image/actualimage"}}
<div class="row">
{{partial "image/comments"}}
</div>
</div>
route/image/index.js: 路径/图像/ index.js:
model: function(params) {
return this.store.find('image', params.image_id);
}
route/image/comments.js: 路径/图像/ comments.js:
model: function() {
return this.store.find('comment');
}
So when I goto the URL /image/image_id, the template/image/index.hbs will be displayed, which contains {{partial "image/comments"}} and I want to partial to load comments using route/image/comments.js. 因此,当我转到URL / image / image_id时,将显示template / image / index.hbs,其中包含{{partial“ image / comments”}}},我想部分地使用route / image / comments加载注释。 JS。 However currently that image/comment route is never triggered.
但是目前,该图像/注释路由从未触发过。
Essentially I wanted that specific template image/index.hbs to have a nested templated image/comments.hbs which used its own model. 本质上,我希望特定的模板image / index.hbs具有使用其自身模型的嵌套模板化image / comments.hbs。
So when I goto the route image/index it loads index.hbs with comments.hbs nested: 所以,当我转到它加载与comments.hbs嵌套index.hbs路线图像/索引:
To achieve this I changed the comments partial to an outlet : template/image/index.hbs: 为此,我将注释部分更改为一个插座 : template / image / index.hbs:
<div class="container">
{{partial "image/actualimage"}}
<div class="row">
{{outlet "image/comments"}}
</div>
</div>
and in my route index added a renderTemplate Hook: route/image/index.js: 并在我的路线索引中添加了renderTemplate挂钩:route / image / index.js:
renderTemplate: function() {
this.render(); // THIS was IMPORTANT to added otherwise ember was throwing an connectOutlet exception.
var model = this.get('store').createRecord('user', {firstName:'shiv'});
var controller = this.controllerFor('image/comments');
this.render('image/comments', { // the template to render
into: 'image/index', // the template to render into
outlet: 'image/comments' // the name of the outlet in that template
});
},
model: function(params) {
return this.store.find('image', params.image_id);
}
Here is another example of a implementation: How to render multiple templates for a route in Router v2 这是另一个实现示例: 如何在Router v2中为路由呈现多个模板
Reference Documentation for using outlets: http://guides.emberjs.com/v1.12.0/routing/rendering-a-template/ 使用网点的参考文档: http : //guides.emberjs.com/v1.12.0/routing/rendering-a-template/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.