pQuestions123
pQuestions123

Reputation: 4611

Aurelia binding is null in custom element

Here is my custom element:

import {bindable, inject, noView, ViewCompiler, ViewSlot, Container, ViewResources} from 'aurelia-framework';
import _findIndex from 'lodash/findIndex';

let view = '<require from="./menu-bar-dd-item"></require>' +
            '<require from="./menu-bar-link-item"></require>' +
            '<ul class="nav navbar-nav">';

@noView
@inject(ViewCompiler, ViewSlot, Container, ViewResources)
export class MenuBar {
    @bindable router;

    constructor(vc, vs, container, resources){

        this.menuItems = [];

        this.createView();

        let viewFactory =  vc.compile(view, resources),
            view = viewFactory.create(container, this);

        vs.add(view);
        vs.attached();
    }

    createView() {...}
}

I use it like this:

<menu-bar router.bind="router"></menu-bar>

Somehow this.router (if I place a breakpoint inside the constructor of MenuBar) is always null.

Thanks in advance.

Upvotes: 0

Views: 559

Answers (1)

Ashley Grant
Ashley Grant

Reputation: 10887

You'll need to put any code that relies on router being set in either the bind or attached callback. The Aurelia binding engine hasn't had a chance to bind to router in the constructor.

The list of component lifecycle callbacks is here: http://aurelia.io/docs.html#/aurelia/framework/1.0.0-beta.1.1.4/doc/article/creating-components/3

Upvotes: 2

Related Questions