Ember.js - "无法对由模板引起的不在DOM中的Metamorph执行操作"

Question

我一直遇到Ember.js抛出错误的问题:

Uncaught Error: Cannot perform operations on a Metamorph that is not in the DOM.

我发现了这 两个 SO问题,这两个问题都涉及直接操作DOM,而我的应用程序并不是这样.搜索错误消息还会返回与相同类型的直接DOM操作相关的许多Github问题.

Answer 1

直到我在Github 上发现这个与错误消息完全无关的搜索时,我才感到茫然.

基本上,错误归结为HTML注释中包含的Handlebars表达式.

在代码中比在单词中说起来可能更容易,所以这里有一个jsFiddle有很多解释:http://jsfiddle.net/niaconis/JSj7W/1/

的{{computedProp}}表达被所使用的模板内的三个地方:正常,HTML注释内,并且把手块注释内.打开Web检查器并单击"重新计算"按钮以查看生成的错误.

您可以从示例的模板中删除HTML注释,并看到代码在不存在时运行正常.

希望这将引导其他开花的Ember开发人员更容易地使用这样一个简单的解决方案.

Answer 2

问题很简单,但追踪实际原因很难.对于我们使用metamorph跟踪的项目,它包含id为metamorph-##-startid和id 的脚本元素metamorph-##-end.在正常情况下,除非不再需要,否则Ember不应将它们移除.有几个原因可以解决这个问题:

• 手动操作DOM.如果手动删除脚本标记,那么它们将无法找到.
• 格式错误的HTML.假设您离开了一个开放的div,那么变形 - ## - end标记将嵌套在与开始标记不同的级别.