John John - 1 month ago 17
Javascript Question

Aurelia - Reference custom element view model inside slot

If I have a custom element like this:

export class mycomponent {
constructor() {
this.name = 'John Doe';
}
}

<template>
My component
<slot></slot>
</template>


And use this component inside another view (I registered the custom element globally):

<template>
<mycomponent>
Test
${name}
</mycomponent>
</template>


It is possible to access the view model of
mycomponent
in this scope? Like printing out its property
name
for example?

Answer

As far as I know, it cannot be achieved using slots.

However, Aurelia has a feature called replaceable parts: [Blog post]. This might be a better fit for your requirements.

Demo: https://gist.run/?id=dcffe2afcb1eee1777e9b0d9f7366d28