[英]Ember.js template rendering
I'm possibly reading the docs wrong. 我可能读错了文档。 Can someone please check out my gist and tell me why the invoices/index
template is not rendering? 有人可以检查我的要旨并告诉我为什么invoices/index
模板没有显示吗?
When I read the ember.js docs it states it should render 当我阅读ember.js文档时,它说应该渲染
posts
↳posts/index
( invoices/index
in my case). (在我的情况下为invoices/index
)。 The invoices
template renders however. 但是, invoices
模板将呈现。
Handlebars: 把手:
<script type="text/x-handlebars" data-template-name="application">
<h1>Ember Committers</h1>
<nav>
{{#linkTo "index"}}Index{{/linkTo}}
{{#linkTo "about"}}About{{/linkTo}}
{{#linkTo "invoices"}}Invoices{{/linkTo}}
</nav>
{{ outlet }}
</script>
<script type="text/x-handlebars" data-template-name="invoices">
<h1>Invoices</h1>
</script>
<script type="text/x-handlebars" data-template-name="invoices/index">
<ul>
{{#each invoice in invoices }}
<li>{{#linkTo "show" invoice.id}}{{ invoice.id }}{{/linkTo }}</li>
{{/each }}
</ul>
</script>
<script type="text/x-handlebars" data-template-name="invoices/show">
<p>Invoice - {{ name }}</p>
</script>
<script type="text/x-handlebars" data-template-name="phone">
<p>Contributor - {{ title }}</p>
</script>
<script type="text/x-handlebars" data-template-name="about">
<p>About {{ title }}</p>
</script>
<script type="text/x-handlebars" data-template-name="index">
<p>Index</p>
</script>
JavaScript: JavaScript的:
<script type="text/javascript" defer>
var App = Ember.Application.create({
LOG_TRANSITIONS: true
});
App.ApplicationView = Ember.View.extend({
templateName: 'application'
});
App.Router.map(function () {
this.route("about");
this.resource("invoices", { path: "/invoices" }, function () {
this.resource("show", { path: "/:id" });
});
});
var invoices = [
{id: 1},
{id: 2}
];
App.AboutRoute = Ember.Route.extend({
setupController: function (controller) {
// Set the IndexController's `title`
controller.set('title', "My App");
}
});
App.InvoicesIndexController = Ember.ArrayController.extend({
invoices: invoices
});
</script>
You need to include an {{outlet}}
tag in your invoices
template. 您需要在invoices
模板中添加一个{{outlet}}
标签。 Since index
and show
are nested resources of invoices
, their templates get rendered inside the outlet that you specify in the invoices
template. 由于index
和show
是invoices
嵌套资源,因此它们的模板将呈现在您在invoices
模板中指定的出口内。
Take a look at the nested resources part of the Ember.js guide. 看一下Ember.js指南中的嵌套资源部分。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.