Question

在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月的这个blog post数据绑定到广告位的name属性和slot属性不起作用。

有人知道现在是否可以或有任何解决方法？

Answer 1

不幸的是，插槽无法实现这一点。由于Shadow DOM规范的限制，它不太可能存在。

您可以查看可更换部件，看看它是否可以执行您需要执行的操作：https://aurelia.io/docs/fundamentals/cheat-sheet#custom-elements

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

在aurelia视图中动态命名多个槽

1 个答案: