将参数传递给模板而不覆盖数据上下文

Vin*_*ent 10 meteor

我想将一个新参数传递给模板,同时保留它的原始数据上下文.

  • 原始数据上下文:{message:"hello"} {{> myTemplate withIcon=True}}
  • 使用{withIcon:True}覆盖数据上下文

我的解决方案是将这样的数据包装起来.

<code>
{{> myTemplate originalData=this withIcon=True}}
</code>
Run Code Online (Sandbox Code Playgroud)

有更好的解决方案吗?

Dav*_*don 13

您始终可以在帮助程序中扩展当前上下文:

Template.parentTemplate.helpers({
  iconContext: function() {
    var result = _.clone(this);
    result.withIcon = true;
    return result;
  }
});
Run Code Online (Sandbox Code Playgroud)

并像这样使用它:

<template name="parentTemplate">
  {{> myTemplate iconContext}}
</template>
Run Code Online (Sandbox Code Playgroud)

或者,您可以创建一个更通用的帮助器,如下所示:

Template.registerHelper('extendContext', function(key, value) {
  var result = _.clone(this);
  result[key] = value;
  return result;
});
Run Code Online (Sandbox Code Playgroud)

然后从任何模板的html中选择键/值对:

<template name="parentTemplate">
  {{> myTemplate extendContext 'withIcon' true}}
  {{> myTemplate extendContext 'isAwesome' false}}
</template>
Run Code Online (Sandbox Code Playgroud)

这两种解决方案都比将原始数据隐藏在单独的字段中更为理想,因为它使子模板保持通用.


Lan*_*son 7

基于David的第二个选项,允许多个属性:

<template name="parentTemplate">
  {{> myTemplate extendContext withIcon=true label="Has Icon" }}
  {{> myTemplate extendContext withIcon=false label="No Icon" }}
</template>
Run Code Online (Sandbox Code Playgroud)

然后在javascript中:

Template.registerHelper('extendContext', function(data) {
  var result = _.clone(this);
  _.each(data.hash, function(value, key) {
    result[key] = value;
  })
  return result;
})
Run Code Online (Sandbox Code Playgroud)

  • 这应该也可以:`return _.extend({},this,data.hash);` (2认同)