Pass parameter to constructor from template

Question

A very basic setup, component:

export class LayerComponent {
    public content: string;

    constructor(content: string) {
        this.content = content;
    }
}

and its template:

<p>{{content}}</p>

From another component i would like to (statically) instantiate the component described passing in the content parameter (without the need for binding it). I took the following approach which doesn't work:

<ipe-artboard-layer content="Joep"></ipe-artboard-layer>
<ipe-artboard-layer content="Floris"></ipe-artboard-layer>
<ipe-artboard-layer content="Casper"></ipe-artboard-layer>

Is the approach possible, adviseable? I'd rather not go for a real binding because it's only to instantiate the component with a one-time initial value for some property of it.

Answer 1

AFAIK it is not possible to invoke constructor this way.

What you're looking for is @Input() binding:

<ipe-artboard-layer [content]="Joep"></ipe-artboard-layer>

And in your component:

export class LayerComponent {
    @Input()
    public content: string;

    constructor() {}
}

Here you can read more about component interactions.