Javascript 把手-是否可以在局部视图中访问父上下文？

我有一个把手模板，它为一个子元素加载一个分部

我需要从调用模板中的父上下文中访问一个变量，从分部代码中访问<代码>。似乎无法解析部分中的任何内容

简化代码如下所示：

Handlebars.registerHelper('whatis', function(param) {
    console.log(param);
});

模板

    {{#each items}} 
        {{> item-template}}
    {{/each}}

    {{#each items}} 
        {{whatis ..}}  <-- Console shows the correct parent context
        {{> item-template}}
    {{/each}}

<div class="mainTemplate">
  Parent Color: {{color}}
  {{> partial}}
</div>

部分

    value is {{value}}

    {{whatis ..}}  <-- Console shows "undefined"
    value is {{value}}

<div>
  {{#each items}}
    <div style="color:{{../color}}">
      {{title}}
    </div>
  {{/each}}
</div>

（很明显，真正的代码更复杂，但这是相同的原理，在部分

中。

似乎没有定义。）

---

为了说明它是未定义的，我使用了一个非常简单的助手

whatis

，如下所示：

Handlebars.registerHelper('whatis', function(param) {
    console.log(param);
});

并将上述代码更新为：

更新的模板

    {{#each items}} 
        {{> item-template}}
    {{/each}}

    {{#each items}} 
        {{whatis ..}}  <-- Console shows the correct parent context
        {{> item-template}}
    {{/each}}

<div class="mainTemplate">
  Parent Color: {{color}}
  {{> partial}}
</div>

{{#每个项目}
{{whatis..}}项模板}}
{{/每个}}

更新的部分内容

    value is {{value}}

    {{whatis ..}}  <-- Console shows "undefined"
    value is {{value}}

<div>
  {{#each items}}
    <div style="color:{{../color}}">
      {{title}}
    </div>
  {{/each}}
</div>

---

{{whatis..}}您可以在github链接的评论中使用一些建议的解决方案：




它们创建帮助程序以将信息传递给分部。
我创建了一个each Helper函数，该函数在key parentContext下的子上下文中包含父键/值


注意：下划线是一种依赖项。

Handlebars.registerHelper('eachIncludeParent', function ( context, options ) {
var fn = options.fn,
    inverse = options.inverse,
    ret = "",
    _context = [];
    $.each(context, function (index, object) {
        var _object = $.extend({}, object);
        _context.push(_object);
    });
if ( _context && _context.length > 0 ) {
    for ( var i = 0, j = _context.length; i < j; i++ ) {
        _context[i]["parentContext"] = options.hash.parent;
        ret = ret + fn(_context[i]);
    }
} else {
    ret = inverse(this);
}
return ret;

使用
{{parentContext.value}}
访问部分中的父上下文值，以防有人无意中发现此问题。此功能现在存在于车把中

这样做：

{{#each items}} 
    {{! Will pass the current item in items to your partial }}
    {{> item-template this}} 
{{/each}}

工作小提琴（灵感来源于AndrewHenderson提出的把手拉动要求#385）

以下是如何设置父模板：

{{#each items}} 
    {{#include parent=..}}
        {{> item-template}}
    {{/include}}
{{/each}}

以及部分：

value is {{parent}}

将父上下文传递给分部的最简单方法是在分部内执行循环。默认情况下，通过这种方式传递父上下文，当您在部分上下文中执行循环时，
{{../variable}
约定可以访问父上下文


数据

{
  color: "#000"
  items: [
    { title: "title one" },
    { title: "title two" },
  ]
}

模板

    {{#each items}} 
        {{> item-template}}
    {{/each}}

    {{#each items}} 
        {{whatis ..}}  <-- Console shows the correct parent context
        {{> item-template}}
    {{/each}}

<div class="mainTemplate">
  Parent Color: {{color}}
  {{> partial}}
</div>


父颜色：{{Color}}
{{>部分}

部分

    value is {{value}}

    {{whatis ..}}  <-- Console shows "undefined"
    value is {{value}}

<div>
  {{#each items}}
    <div style="color:{{../color}}">
      {{title}}
    </div>
  {{/each}}
</div>


{{{#每项}
{{title}}
{{/每个}}
我需要这样的动态表单属性

    {{#each model.questions}}
      <h3>{{text}}</h3>

          {{#each answers}}
                {{formbuilder ../type id ../id text}}
            {{/each}}

    {{/each}}

{{{#每个模型.问题}
{{text}}
{{{#每个人都回答}
{{formbuilder../type id../id text}
{{/每个}}
{{/每个}}

像这样的帮手

    Handlebars.registerHelper('formbuilder', function(type, id, qnum, text, options)
    {
        var q_type = options.contexts[0][type],
            a_id = options.contexts[1].id,
            q_number = options.contexts[0][qnum],
            a_text = options.contexts[1].text;


            return new Handlebars.SafeString(
                    '<input type=' + q_type + ' id=' + a_id + ' name=' + q_number + '>' + a_text + '</input><br/>'
            );
    });

handlebar.registerHelper（'formbuilder'，函数（类型、id、qnum、文本、选项）
{
var q_type=options.context[0][type]，
a_id=options.contexts[1].id，
q_number=options.context[0][qnum]，
a_text=options.contexts[1].text；
返回新把手。安全字符串(
“+a_text+”
”
);
});

这就产生了

<input type="checkbox" id="1" name="surveyQ0">First question</input>

第一个问题

我的模型是一大团数组和对象混合在一起。值得注意的是，使用“../”like so“../type”将父模型作为上下文传递，而不使用它（如使用“id”），则将当前模型作为上下文传递。
从2.0.0开始

我花了一些时间才找到这个，希望它对其他人也有用
 要获得分部的具体父项（您可能有几个分部深），请按照其他答案，如SeanWM

如果您知道父模板是主模板，那么您可以使用@root，它解析为最顶层的上下文，无论您有多深

e、 g.{{@root.rootObject.rootProperty}

很遗憾。。不会超过一个部分。
是的！有时，我们会忽略显而易见的问题，寻找其他解决方案。至少在他们发布里程碑或新版本之前。这只是一个难以置信的不雅观的解决方案。如果你不想浏览源代码并自己修复它，请考虑一个临时解决方案。我讨厌这种“变通办法”（即使这个词对我来说似乎是错误的），但它有效，可以在紧迫的期限内节省时间。这如何解决问题？此外，还有一个
var选项=
，以后似乎不会使用。如果使用此帮助器，您将可以访问部分模板中的一个对象，该部分模板包含所有值，包括父对象和子对象。它基本上是一个合并的上下文。注意：此时子值和父值将处于同一级别。作为一种解决方法可能会有所帮助，但应注意，它会通过向传递给模板的原始对象添加父上下文变量而污染这些对象。。这可能不适合所有情况。。另外，
var option=context[i].value | | context[i]
应该去掉，它没有任何作用……我同意这肯定是一个解决办法，而把手上缺少功能。默认值仅添加到对象中，与u.extend相反，后者将覆盖匹配的键值。对象仅在辅助对象的局部范围内受到污染。助手使用对象返回一个字符串，该字符串到此结束。我认为在这种情况下没有必要担心物体污染。谢谢@james andres。很高兴知道它终于来了。我会让它转一转来确认…刚刚测试过这个。不幸的是，它对我不起作用。无法传递父上下文。“this”仅指项目[：index]，因此父上下文被忽略。如果您传递了“.”，其中将包含父上下文，则无法访问部分中的当前项。您至少需要这样才能工作。还要检查，因为它的工作方式可能有点不同。@Hans，您可以传递
{{{>item template parent=..}}
，然后调用
{{parent.stuff}
在项目模板中访问每个项目外部的内容。如何访问通过
此
传递给子项目的上下文属性。与Handlebar 2.0中的其他方法相比，我更喜欢此方法的清洁度和灵活性。此功能非常棒。请记住，如果传递一个部分int