流星#each块打破#constant区域答案

【问题标题】：Meteor #each block breaks #constant region流星#each块打破#constant区域
【发布时间】：2013-12-10 18:41:07
【问题描述】：

我有一个补间的 D3 甜甜圈，所以我要求保留 svg。我发现#constant 区域就像一个魅力，直到我尝试在它周围使用#each 块来制作多个甜甜圈：

尽可能简单（这里的甜甜圈返回单个项目）

{{#with donuts}}
<div id="donut-container-{{emoticonName}}" class="donut-container">
{{#constant}}
    <img id="img-{{emoticonName}}" src="/images/emoticons/{{emoticonName}}.png"   class="emoticon">
    <svg id="svg-{{emoticonName}}" class="svg-donut"></svg>
{{/constant}}
</div>
{{/with}}

这就像一个魅力 - 补间的行为就像 svg 没有重新渲染一样。

一旦我这样做了（这里的甜甜圈返回 [] 里面有单个项目）：

{{#each donuts}}
<div id="donut-container-{{emoticonName}}" class="donut-container">
{{#constant}}
    <img id="img-{{emoticonName}}" src="/images/emoticons/{{emoticonName}}.png"   class="emoticon">
    <svg id="svg-{{emoticonName}}" class="svg-donut"></svg>
{{/constant}}
</div>
{{/each}}

常量区域不再起作用，事物重新渲染而不是被保留。请注意，在这两种情况下，我仍然只渲染一个甜甜圈以将问题隔离到 #each 块。

对此的任何帮助将不胜感激。谢谢。

【问题讨论】：

标签： javascript meteor handlebars.js

【解决方案1】：

因此，有时只需以足够清晰的形式提出问题以供其他人理解，就会使答案跳出来......

{{#constant}}
{{#each donuts}}
<div id="donut-container-{{emoticonName}}" class="donut-container">  
    <img id="img-{{emoticonName}}" src="/images/emoticons/{{emoticonName}}.png"   class="emoticon">
    <svg id="svg-{{emoticonName}}" class="svg-donut"></svg>
</div>
{{/each}}
{{/constant}}

看起来很明显，我几乎感到尴尬：D

【讨论】：

【解决方案2】：

尝试删除常量标签并使用meteor --release template-engine-preview-5.5 运行meteor。这将允许您在使用 D3 的同时使用反应性。一旦 Meteor UI 发布（可能在 2014 年初与 Meteor 1.0 一起发布），您就可以再次使用 meteor 运行该应用程序。

【讨论】：

是的，我们试过了——虽然它确实解决了这个问题，但它确实破坏了其他一些东西（这很可能是我们做错的更多事情，但是嘿）。我自己解决了这个问题 - 请参阅我的答案