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.

Pass data into ons-template for data-binding (from parent element to child)?

  • Is it possible to pass data to <ons-templates> for data-binding like handlebars.js?
    I’ve seen the angular examples use binding, but I’m using plain javascript.

    Something like specifying data-binding values via the parent element’s data attributes would be ideal:

    <ons-tabbar swipeable position="auto" hide-tabs="true" id="tab">
      <ons-tab label="Tab 1" page="tabTemplate.html" data-pagenumber="555">
    <template id="tabTemplate.html">
      <ons-page class="tabpage">
        <p style="text-align: center;">
         This is page {{data-pagenumber}}.

  • Very interested in this - don’t think its supported without using Angular, React, Vue etc… But if it is, interested to hear approaches…