Skip to content
This repository was archived by the owner on Feb 20, 2019. It is now read-only.

Manually instantiate a OneJS view

dzearing edited this page Nov 21, 2014 · 2 revisions

When working within a OneJS page, often you simply nest views in each other and don't think about how to manually create them. The root is often created for you in main.ts if you've used the yo template.

If you're building a reusable control that you want others to consume, they will need to new the control to render and embed it in their web project.

Instantiating a Foo view from stratch without using OneJS is simple. All views are just implementations of IView that can be instantiated and rendered.

Here's the expected calling pattern:

require(['Foo'], function(Foo) {

    // you create the new Foo view.
    var foo = new Foo();

    // you (optionally) give it data.
    foo.setData({ data: 'stuff' });

    // you render it and add the returned element to the DOM.
    document.getElementById('someElementId').appendChild(foo.render());

    // you activate it to inform it that its in the dom.
    foo.activate();

}

If you want to disable the events of the Foo control, you can deactivate it and later reactivate it. (For example, in a tab view, you want to disable keyboarding.)

    foo.deactivate();

    // and later...
    foo.activate();

If you want to shut the control down permanently, you can call dispose. This will deactivate it first if it's not already deactivated.

    foo.dispose();
Clone this wiki locally