您的位置:首页 > 其它

4.6 Routing -- Rendering A Tempalte

2016-01-25 16:19 288 查看
1. route handler一个重要的任务就是渲染合适的模板到屏幕。

2. 默认的,一个route handler将会呈现模板到最近的父模板。

app/router.js

Router.map(function() {
this.route('post');
});


app/routes/post.js

export default Ember.Route.extend();


3. 如果你想呈现一个和route handler相关模板之外的模板,实现renderTemplate hook:

app/routes/post.js

export default Ember.Route.extend({
renderTemplate() {
this.render('favoritePost');
}
});


4. 如果你想使用route handler的controller之外不同的controller,传递这个controller的名字到controller选项:

app/routes/post.js

export default Ember.Route.extend({
renderTemplate() {
this.render({ controller: 'favoritePost' });
}
});


5. Ember允许你命名你的outlets。下面的例子使用了明确的名字指定了两个outelets:

<div class="toolbar">{{outlet "toolbar"}}</div>
<div class="sidebar">{{outlet "sidebar"}}</div>


所以如果你想要呈现你的posts到sidebar outlet,使用这样的代码:

app/routes/post.js

export default Ember.Route.extend({
renderTemplate() {
this.render({ outlet: 'sidebar' });
}
});


6. 上面描述的所有选项可以被一起使用,你想要什么组合都可以:

app/routes/post.js

export default Ember.Route.extend({
renderTemplate() {
var controller = this.controllerFor('favoritePost');

// Render the `favoritePost` template into
// the outlet `post`, and use the `favoritePost`
// controller.
this.render('favoritePost', {
outlet: 'post',
controller: controller
});
}
});


7. 如果你想要渲染两个不同的模板到一个路由的两个不同的被加载的模板的outlets中:

app/routes/post.js

export default Ember.Route.extend({
renderTemplate() {
this.render('favoritePost', {   // the template to render
into: 'posts',                // the template to render into
outlet: 'post',              // the name of the outlet in that template
controller: 'blogPost'        // the controller to use for the template
});
this.render('comments', {
into: 'favoritePost',
outlet: 'comment',
controller: 'blogPost'
});
}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: