Aurelia 中的嵌套自定义元素未按预期呈现

Question

我有一个自定义元素，它定义了一个具有各种可绑定默认选项的通用 UI 小部件框架，一个用于添加一些额外 'toolbar' 选项的模板部分和 general-purpose <content /> 对于 body.

然后我有另一个用于某些管理功能的自定义元素。后一个元素应该将自己呈现为一个小部件，并且它也有各种模板部分。

但是，如果我尝试将前一个小部件元素嵌入到后一个管理元素中，none 将呈现内容。

这是一个简化的例子：

eg-block（小部件）元素

<template>
  <div style="padding: 10px; background-color: #bbffff">
    <content></content>
  </div>
</template>

eg-list（管理员）元素

<template>
  <require from="./eg-block"></require>
  <eg-block>
    <div>Start of List</div>
    <content></content>
    <template replaceable part="list-part">Default List Part</template>
    <div>End of List</div>
  </eg-block>
</template>

包含页面

<template>
  <require from="./eg-list"></require>
  <eg-list>
    <template replace-part="list-part">Replaced List Part content</template>
    <div>Replaced regular content</div>
  </eg-list>
</template>

我希望结果是：

<div style="padding: 10px; background-color: #bbffff">
  <div>Start of List</div>
  <div>Replaced regular content</div>
  <div>Replaced List Part content</div>
  <div>End of List</div>
</div>

但它给了我：

<div style="padding: 10px; background-color: #bbffff">
  <div>Start of List</div>
  <div>End of List</div>
  <div>Default List Part</div>
</div>

因此它不会呈现列表的内容或替换包含页面中指定的模板部分。但另外，列表模板部分的默认内容实际上是在列表之后呈现的。

这是预期的行为吗？如果是这样，是否有任何方法可以在 admin/list 元素中保留 widget/block 元素的使用，但让它以我希望的方式呈现？

Answer 1

我主要是 copy/pasting 来自的回答，但这里是：

让我先说明一下 Aurelia RC1 中的内容投影正在完全改变（并且变得更好）。我们正在转向基于插槽的内容投影，以与最新版本的影子 DOM 规范相匹配。该规范比 Aurelia 目前拥有的基于选择器的设置（基于 Shadow DOM 规范的早期版本）强大得多。这是我们从现在到完整的 Aurelia 1.0 之间计划的唯一重大更改。

所以我告诉你的一切很快就会过时。

同时，自定义元素视图中的元素需要位于模板的根部。至于为什么 Aurelia 会这样，那是 bug:-) It has been fixed in the new implementation.

我们刚刚发布了关于新插槽实现的，如果您想了解它是如何工作的。

Aurelia 中的嵌套自定义元素未按预期呈现

Nested Custom Elements in Aurelia not rendering as expected

aurelia