Does Aurelia have virtual elements?

Question

JS Knockout has a virtual elements concept. These are the “mute” elements you can bind to, which do not have an HTML element as a container. This allows you to bind arrays in a container that does not produce external HTML.

For example, in Knockout JS you can do something like:

<!-- ko foreach: items -->
  <li data-bind="text: $data"></li>
<!-- /ko -->

A series of tags liwill be released without a parent element.

Does Aurelia offer something similar? I see you can create custom elements in Aurelia that can be connected, but these custom elements are thrown into the DOM as HTML elements.

For example, in Aurelia you can do something like:

<foo repeat.for="item of items" foo.bind="item"></foo>

However, this will result in element tags foo. How do you do something like this in Aurelia without the tags of unwanted parent elements?

Answer 1

Thank you James Thorpe for what pointed me in the right direction. Aurelia has added an attribute @containerlessthat you decorate with your class of special elements. When you do this, it displays without a container.

Example:

import {customElement, containerless} from 'aurelia-framework';

@customElement('foo')
@containerless
export class Foo {
}