我正在尝试构建一个 Ember 应用程序，我想将嵌套路由的默认模板渲染到索引路由中。这是 router.js
export default Router.map(function() {
this.route('posts', function() {
this.route('featured');
this.route('authors');
this.route('popular');
});
});
这是 posts-index.hbs 模板:
<div class="posts">
<h2>Welcome to your blog posts</h2>
<p>Here are your posts:</p>
<ul>
<li>{{#link-to 'posts.featured'}}Featured{{/link-to}}</li>
<li>{{#link-to 'posts.authors'}}Authors{{/link-to}}</li>
<li>{{#link-to 'posts.popular'}}Popular{{/link-to}}</li>
</ul>
<div class="posts-container">
{{outlet}}
</div>
</div>
这是 posts-index/featured.hbs 模板:
<div class="featured-posts">
<h3>List of featured posts</h3>
<p>...</p>
</div>
其他模板与featured模板相同。
正如您在上面的应用程序中看到的，我希望当用户访问 /posts 时，他们将看到 posts-index 模板，以及 posts/featured.hbs 模板被默认呈现。当然，用户仍然可以导航到 url /posts/featured，并看到相同的内容。
对此有任何建议，我们将不胜感激。谢谢!
最佳答案
Ember Route 提供了一个 renderTemplate你可以像这样使用的钩子(Hook):
App.PostsIndexRoute = Em.Route.extend({
renderTemplate: function() {
// renders the template for the current route, as per conventions
// in your case it will be 'posts/index'
this.render();
// renders the named template 'posts/feature' *into* another named template
this.render('posts/featured', {
into: 'posts/index' // which in this case is 'posts/index'
});
}
});
(参见 JSBin)
关于javascript - EmberJS : Render default template，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30108560/