Dom Dart WebUI自动生成代码的问题

我对web组件的自动生成代码有疑问。 下面是一段HTML：

<div id="hidden-ui">
  <div id="auth-form" class="...">
    ...
    <to-button></to-button>
  </div>
  ...
</div>

启动时，我想将

#auth form

从父节点移到文档根节点：

Element af = document.query('#auth-form');
Element db = document.query('BODY');
db.children.add(af);

若移动节点中并没有自定义web组件，那个也没关系，但当

to按钮

在移动节点中时，我得到了运行时范围错误

下面是一段自动生成的代码：

 __e1 = __root.nodes[9].nodes[1].nodes[7];
 __t.component(new TOSimpleButton()..host = __e1);

正如您所看到的，组件有严格的旧路径，因此会引发RangeError异常

---

我该如何处理这个问题呢？

听起来你好像想时不时地显示弹出式表单。我就是这么做的

我为对话框/弹出窗口指定此构造函数：

var生命周期调用程序；
DialogFooComponent（）{
host=new Element.html（“”）；
lifecycleCaller=新组件项（此）
…创建（）；
document.body.children.add（主机）；
lifecycleCaller.insert（）；
}

如您所见，我将其添加到文档体中。但是，这仅在创建新实例时发生

每当我需要显示弹出窗口时，我都有如下代码：

import'../dialog/foo/foo.dart'；
...
//稍后我会：
新的DialogFooComponent（）；

发生的事情是，只要你愿意，你的身体就会出现弹出式表单

如果要关闭对话框，可以在对话框组件内部调用：

lifecycleCaller.remove（）；

如前所述，这不会在WebUI包中修复，但会在聚合物中修复

这不会在web_ui pkg中修复。它应该在聚合物包装中工作

---

为什么需要移动身份验证表单？为什么你不能首先将其放置在正确的DOM位置？@PixelElephant，其想法是让隐藏的DIV包含所有UI元素（正式的弹出表单），这可能有用或无用，因此当我需要显示身份验证表单时，我将其移到文档根目录，当我需要隐藏它时，只需将其移回隐藏DIV。我同意，我可以使用另一种方法，而且我已经使用了另一种方法，但我认为这是一个合理的问题，不是吗？好的，我只是不认为在你的特殊情况下有必要，但我同意在其他情况下这可能是一个问题。我如何使用html模板与这种方法？你的意思是什么？您没有在HTML中插入对话框/弹出窗口，而是在用户单击某个内容时调用

new DialogFooComponent（）

，等等。我理解了，我提到了HTML模板文件，其中组件被描述为可选样式的HTML结构。与WebUI组件一样（Dart+HTML）。

 __e1 = __root.nodes[9].nodes[1].nodes[7];
 __t.component(new TOSimpleButton()..host = __e1);