dynamically naming multiple slots in aurelia view

Question

In Aurelia I have created a custom element who interacts as a container. This container creates some ui elements around the child nodes.

These custom elements can be used in any view as follow:

<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>

In the wizard-container class I read all children like this @children('wizard-step') steps = []; and loop over them in the template:

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

The Problem is that the slots are not going to be created.

I'm also not able to add any element to these slots like this

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

According to this blog post from May 2016 data binding to slot's name attribute and to the slot attribute is not working.

Does someone knows if it is now possible or has any idea for a workaround?

Ashley Grant · Accepted Answer · 2019-04-25T16:01:19.007

2

This is not possible with slots, unfortunately. It isn't likely that it will be possible due to limitations of the Shadow DOM spec.

You might look at replaceable parts to see if it can do what you need to do: https://aurelia.io/docs/fundamentals/cheat-sheet#custom-elements

Scroll down a bit and you'll see some information on replaceable parts. That being said, I'm not sure if this will work for you. I've never tried using dynamically named template parts.

edited Apr 25 '19 at 16:01

answered Jul 25 '17 at 19:42

Ashley Grant

10,879
24
36

Sadly dynamically named template parts are not working. Have to find another solution. Thanks – iocast Jul 26 '17 at 06:45
@iocast named template parts work fine. Take a look at this question https://stackoverflow.com/questions/44402632/in-aurelia-can-a-slot-be-used-in-a-repeat-for-binding/44405040 – Fabio Jul 26 '17 at 20:09
Fabio, that doesn't show dynamically named template parts – Ashley Grant Jul 26 '17 at 20:22
@locast, have you find another solution for this? – Jaunius Eitmantis Feb 17 '18 at 17:29

dynamically naming multiple slots in aurelia view

1 Answers1