1

在 Aurelia 中，我创建了一个作为容器交互的自定义​​元素。这个容器在子节点周围创建了一些 ui 元素。

这些自定义元素可以在任何视图中使用，如下所示：

<wizard-container ref="container">
  <wizard-step title="Step 1" view-model="step1"></wizard-step>
  <wizard-step title="Step 2" view-model="step2"></wizard-step>
  <wizard-step title="Step 3" view-model="step3"></wizard-step>
</wizard-container>

在wizard-container课堂上，我阅读了所有这样的孩子@children('wizard-step') steps = [];，并在模板中循环遍历它们：

...
<div class="step" repeat.for="step of steps">
  <slot name="step-${$index}"><p>slot-${$index}</p></slot>
</div>
...

问题是不会创建插槽。

我也无法像这样向这些插槽添加任何元素

<template slot="slot-${idx}">
  <p>hello world</p>
</template>

根据 2016 年 5 月的这篇博客文章，数据绑定到插槽的name属性和slot属性不起作用。

有人知道现在是否可行或有任何解决方法的想法吗？

4

1 回答 1

2

不幸的是，这对于插槽是不可能的。由于 Shadow DOM 规范的限制，这不太可能实现。

您可能会查看可更换部件，看看它是否可以做您需要做的事情：https ://aurelia.io/docs/fundamentals/cheat-sheet#custom-elements

向下滚动一点，您会看到一些有关可更换部件的信息。话虽如此，我不确定这是否适合你。我从未尝试过使用动态命名的模板部件。

于 2017-07-25T19:42:48.290 回答