aurelia Creating A Custom Element Using the @customElement Decorator


In most examples, the class naming convention is used to define an Aurelia Custom Element. However, Aurelia also provides a decorator that can be used to decorate a class. The class is again treated as a custom element by Aurelia then.

The value supplied to the decorator becomes the name of the custom HTML element.

Example: my-element.js

import {customElement} from 'aurelia-framework';

export class MyClass {

    <h1>I am a robots custom element</h1>

Using it:

    <require from="./my-element"></require>