我正按照this Evented Mind video (7:07)尝试制作痕迹痕迹。
我希望文章标题显示在/
分隔符旁边。这是一张图片供参考:
当我导航到文章页面时,/
分隔符会动态显示在痕迹路径中,但标题不会显示。
奇怪的是,标题显示在主要区域,就在下方。不应该在contentFor
块中提供模板的数据上下文吗?
这是我的布局模板。查看底部的产量区域:
<template name='Layout'>
<div class="container">
<div id="new-article">
{{#linkTo route="blog.new"}}
New Article
{{/linkTo}}
</div>
</div>
<ul class="breadcrumb">
{{> yield "breadcrumbs"}}
</ul>
<div class="content">
{{> yield}}
</div>
</template>
这是带有问题的痕迹痕迹的模板(位于最顶层):
<template name='Article'>
{{#contentFor "breadcrumbs"}}
<li>
{{#linkTo route="home"}}
Home
{{/linkTo}}
</li>
<li>
<span class="divider">/</span>
</li>
<li>
{{title}}
</li>
{{/contentFor}}
<h1>
{{title}}
</h1>
<div>
{{author}}
</div>
<p>
{{body}}
</p>
</template>
答案 0 :(得分:1)
问题不在于HTML。它与路由器上设置的数据选项有关。由于某些原因我不完全理解并希望向我解释,在“布局”功能上定义数据选项会使数据可用于布局和正在呈现的模板。
我的假设是两个屈服区域 - 面包屑和主要 - 具有从布局继承的不同范围。即使块内容的代码写在文章模板中。
<强>之前:强> 在下面的代码中,数据选项在文章模板上定义。
Router.route("/blog/:_id", function(){
this.layout("Layout");
this.render('Article', {
data: function() {
return Articles.findOne({_id: this.params._id});
}
});
}, {
name: 'article.show'
});
之后:在下面的代码中,将在布局上定义数据选项。
Router.route("/blog/:_id", function(){
this.layout("Layout", {
data: function() {
return Articles.findOne({_id: this.params._id}); // good to make these functions, so that they stay reactive
}
}); // you can set data context here too, which is accessible to all children
this.render('Article', {});
}, {
name: 'article.show'
});