Question

我尝试使用这样的递归模板：

<template name="generate">
  {{#if elements}}
    {{#each elements}}
      <div>{{#if elements}}{{> generate}}{{/if}}</div>
    {{/each}}
  {{else}}
    {{> generate elements=getElements}}
  {{/if}}
</template>

与帮助者：

Template.generate.helpers({
  getElements: function() {
    return Elements.find()
  }
})

和“Elements”数据对象：

[{ 
  _id : "fgQ4GHrrZGFFGWPZQ", 
  elements" : [{
    _id : "hY8iAYJC4KBwGKN84",  
    elements : [] 
  }]
},{ 
  _id : "rtMNfaQYwqzNTYqoD", 
  elements : [{
    _id : "p2wJeGdtiGMYBQtpW",  
    elements : [] 
  }]
}]

我遇到了键盘事件无响应而其他功能停止运行的问题。模板不是为处理这种递归而设计的吗？如果是这样，我将尝试不同的方法，但我认为这会工作。其他人看到这个或有任何建议吗？谢谢！

编辑：这将有效。我的问题是在“渲染”回调上设置键盘事件处理程序，该回调被多次调用（每次渲染模板时），这导致我提到的问题。我会删除这个问题，但stackoverflow。谢谢everybuddy！

Answer 1

这里有一些错误。

首先。你有一个名为getElements的助手，你就像elements

一样召唤它

第二次您将模板调用到同一模板{{> generate}}

<template name="generate">
  {{#if elements}}
    {{#each  getElements}}
      <div>{{#if elements}}{{> anotherTemplateName}}{{/if}}</div>
    {{/each}}
  {{else}}
    {{> generate elements=getElements}}
  {{/if}}
</template>

elements助手看起来如何？ {{#if elements}}

建议将在此处使用嵌套模板。

<template name="generate">
      {{#if elements}}
        {{> generateExample}}
      {{else}}
        {{> generate elements=getElements}}
      {{/if}}
    </template>

<!-- Generate Example Template -->

    <template name="generateExample">
            {{#each  getElements}}
              <div>{{#if elements}}{{> anotherTemplateName}}{{/if}}</div>
            {{/each}}
    </template>

请查看此Understanding Spacebars以获得更好的学习体验

Answer 2

与Javascript不同，Spacebars considers an empty array [] to be falsy。因此叶子节点（具有{{#if elements}}）的初始elements: []将为false，触发{{> generate elements=getElements}}，最终导致无限递归。

您可以通过完全删除{{#if}}，然后在最初包含{{> generate elements=getElements}}时调用generate来解决此问题：

<body>
    {{> generate elements=getElements}}
</body>

<template name="generate">
    {{#each elements}}
        <div>{{#if elements}}{{> generate}}{{/if}}</div>
    {{/each}}
</template>

流星递归模板不起作用

2 个答案: