我尝试检测哪个模板包含另一个模板,以便为特定模板包含项提供不同的 css 类。我已经问过这个问题here .
建议的解决方案是这样的:
app.html:
<body>
{{> parentTemplate parentContext}}
</body>
<template name="parentTemplate">
{{> childTemplate specialContext}}
{{> childTemplate}}
</template>
<template name="childTemplate">
<div class="{{isSpecialClass}}">
<p>parent name: {{name}}</p>
</div>
</template>
app.js
if (Meteor.isClient) {
Template.body.helpers({
// add some context to the parent do demo how it can be modified
parentContext: {name: 'dave'}
});
Template.parentTemplate.helpers({
specialContext: function () {
// make a copy of the parent data context
var data = _.clone(Template.instance().data || {});
// modify the context to indicate the child is special
data.isSpecial = true;
return data;
}
});
Template.childTemplate.helpers({
isSpecialClass: function () {
// grab the context for this child (note it can be undefined)
var data = Template.instance().data;
if (data && data.isSpecial)
// add the 'awesome' class if this child is special
return 'awesome';
}
});
}
现在的问题是我的 childTemplate
具有 parentTemplate
的上下文。我检查了 parentTemplate
的数据,它有字段 isSpecial
,它只是有错误的上下文。知道为什么会发生这种情况吗?例如,如果我在 childTemplate
中使用 {{title}}
,我将获得父上下文对象的标题,但我想要 childTemplate 的上下文
.
最佳答案
我误解了原来的问题。我的答案过于复杂,因为我认为必须保留父上下文。如果您只需要修改子上下文,实际上会更容易一些。这是一个有效的示例:
app.html
<body>
{{> parentTemplate}}
</body>
<template name="parentTemplate">
{{#each children}}
{{> childTemplate}}
{{/each}}
</template>
<template name="childTemplate">
<div class="{{isSpecialClass}}">
<p>name: {{name}}</p>
</div>
</template>
app.js
if (Meteor.isClient) {
Children = new Mongo.Collection(null);
Meteor.startup(function () {
Children.insert({name: 'joe'});
Children.insert({name: 'bob'});
Children.insert({name: 'sam'});
});
Template.parentTemplate.helpers({
children: function () {
// find all of the children and modify the context as needed
return Children.find().map(function(child, index) {
// modify the child context based on some aspect of the child or index
if ((index == 0) || (child.name == 'bob'))
child.isSpecial = true;
return child;
});
}
});
Template.childTemplate.helpers({
isSpecialClass: function () {
// add the 'awesome' class if this child is special
if (this.isSpecial)
return 'awesome';
}
});
}
在此版本中,父级查找所有子级,并通过将 isSpecial
添加到子级上下文仅(如果子级位于列表中的第一个或如果这个 child 的名字是“鲍勃”。现在,子级只需要在其类帮助器中检查 this.isSpecial
。如果您有任何疑问,请告诉我。
关于javascript - childTemplate 中的 ParentContext - Meteor,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26843042/