3. Onsen v2 with Angular 1.5 component

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Onsen v2 with Angular 1.5 component

  • K

    I am trying to use the new component with Angular 1.5. Unfortunately, it is not rendering correctly with the Onsen components. For example, I wanted to create a toolbar component. However, the properties won’t bind to <ons-toolbar>

    Declared on my pages like so:

    <shared.components.toolbar left="menu" center="Home Page" right=""></shared.components.toolbar>

    The component html:

    <ons-toolbar>
        <div class="left">
            <!-- Toolbar-button with different icons depending on the platform. -->
            <ons-toolbar-button component="button/menu">
                <ons-icon icon="ion-navicon, material:md-menu" size="32px, material:24px"></ons-icon>
            </ons-toolbar-button>
        </div>
        <div class="center">{{toolbar.center}}</div>
        <div class="right">

        </div>
    </ons-toolbar>

    The component js:

    angular.module('theApp').component('shared.components.toolbar', {
    templateUrl: './app/shared/components/toolbar.html',
    controller: toolbarController,
    controllerAs: 'toolbar',
    bindings: {
        left: '@',
        center: '@',
        right: '@'
    }
});

function toolbarController() {
    var vm = this;

}

    Howver, it renders the page title as {{toolbar.center}} instead of binding correctly. Any ideas?

    0 1 Reply
  • Onsen UI

    @kevinashkore Angular 1.5 components haven’t been tested with Onsen UI so far. I guess they introduced it to make it more similar to Angular 2 and so developers can migrate their apps later on.
    We will check this at some point but it’s not a priority right now. Any insight you have about this is welcome, especially in the shape of PRs!

    0