从dart代码嵌套web组件

我有多个嵌套的web组件来表示网格。我需要在dart代码中编写这些。 我有一个创建dart文档推荐的web组件的功能：

void addWebComponent（WebComponent组件、字符串标记名、WebComponent父项）{
component.host=（new-Element.html（“”）；
var lifecycleCaller=新组件项（组件）
…创建（）；
parent.append（component.host）；
lifecycleCaller.insert（）；
返回；
}

每个web组件都包含一个模板，如下所示：

我的假设是调用parent.append（component.host）将把注入的web组件html添加到内容元素中。没有。 这就是我所期望的结果：

...           

这就是我得到的：

**[内容应在此处！]**
**[内容到此结束]**
...           

我的猜测是，从dart代码中，您无法通过parent.append（component.host）添加到web组件的内容。是否需要其他功能或步骤来实现此功能？ 我快死了

试试这个：

添加到父级：

List items=toObservable（[]）；

更改：

parent.append（component.host）；

致：

parent.items.add（组件）；

然后将HTML修改为：

{{new SafeHtml.unsafe（item.host.innerHtml）}

作为“字符串标记名”传递的是什么？此外，在调用addComponent函数之前，是否已将“parent”插入DOM？从main调用时，标记名为“x-grid”，从gridComponent调用时，标记名为“x-row”，从RowComponent调用时，标记名为“x-column”。在调用addComponent之前，我必须进行更多测试，以查看是否已将父级插入DOM。我的印象是lifecycleCaller.insert（）将组件添加到Dom中。如果是这种情况，那么在将组件添加到父级之前，不会将父级添加到dom中。文档在动态创建web组件方面很弱。您的“主机”应该是元素扩展的HtmlElement（即DivElement）。您的“组件”应该是您为其创建的WebComponent子类（即：new XRow（）；）。我尝试了类似的测试用例，但无法重现您的结果，我的元素按您的预期嵌套。但是我有一个比我确定你的代码要小得多的例子，可能有一些显著的差异。我将主机更改为普通Div，但得到了相同的结果。所有嵌套组件都不会插入到内容区域中。html中嵌套组件的情况也是如此：该死的x行被附加为父组件的最后一个子元素，而不是插入到template.Hmm区域中。我得到一个错误：HTML有0个顶级元素，但应该有1个。这很痛苦。出于某种原因，我的M5版本没有遇到任何调试器断点，这使得找出这个lol非常令人沮丧。抛出这个错误是因为

SafeHTML.unsafe（）

只需要一个顶级HTML元素。我不确定为什么它有0，听起来好像主机还没有正确初始化..Hmm。当我关闭useShadowDom时，它工作！问题，这会影响Web组件的工作方式吗？这有点令人困惑。我使用了outerHtml而不是innerHtml，所以我的组件被注入DOM中。同样，如果我按照您的方式执行，我将失去用html声明webcomponents的选项。