如何更新 Ember 模板中辅助主体内的变量

Posted 2023-02-23

【中文标题】如何更新 Ember 模板中辅助主体内的变量

【英文标题】：How to update variables that are inside a helper body in an Ember template

【发布时间】：2019-03-06 01:36:13

【问题描述】：

想象一下控制器中的属性myNumber 每秒都有一个不同的随机数。使用此模板，您每秒都会看到这种变化：

<h4>Random number</h4>
<p>myNumber</p>

但是，当数字仅在助手内部引用时（例如#if 或#each），数字不再更新。这将只显示初始值：

<h4>Random number</h4>
#if model
    <p>myNumber</p>
/if

（请注意，myNumber 与 model 无关。只是使用一些随机的真实属性。）

有趣的是，当您将对该属性的引用添加回文档的根目录时，以前的静态数字现在也会更新：

<h4>Random number</h4>
myNumber -- Without this reference, references below won't update.
#if model
    <p>myNumber</p>
/if

如何在帮助程序更新中添加myNumber，而不在模板的根目录中显示数字？

我尝试在 html cmets 中添加引用，但这不起作用。我假设 Ember 不会绘制不在 DOM 中的元素：

<h4>Random number</h4>
<!-- myNumber -->
#if model
    <p>myNumber</p>
/if

起作用的是将值添加到 DOM，但隐藏它。然而，这是一个丑陋的解决方案：

<h4>Random number</h4>
<span style="display:none">
    myNumber
</span>
#if model
    <p>myNumber</p>
/if

【问题讨论】：

我认为我们可能需要有关您遇到的特定场景的更多信息——因为我在这里复制了您的场景：ember-twiddle.com/… 和 myNumber 每秒正确更新。 :-\

myNumber 在您的应用中有何变化？

@NullVoxPopuli 这很奇怪！我试图以越来越复杂的方式重新创建我的应用程序，但它没有显示我在本地观察到的行为。无论如何，我的环境中有一些不同的东西，因为在 twiddle 中我不能使用“this”两个层次的深度（例如控制器>动作>承诺），但在本地我可以。因此，在 Twiddle 中，我必须将 const controller = this 设置为高一级。我尝试在 Twiddle 中更改 Ember 版本（我使用 3.1.4），但没有任何变化。在我的应用程序中，myNumber 更改如下：this.send() -> action -> promise -> this.set()

为什么不能用this两层深？我想我可能需要了解有关您的具体设置的更多信息。

如果你不能在 twiddle 中复制一个最小的带有复制的 git repo 也可以帮助我们

【参考方案1】：

使用箭头函数将解决您的问题。

【讨论】：

这并不能解决问题。该问题无法在 Twiddle 中重现。有时间我会做一个仓库。