@emccorson Thanks for the reply.

.

According the ons-tab docs, the page attribute can only be specified during initialisation i.e. changing it dynamically won’t do anything. Since this is the case I’m not sure it’s currently possible to create dynamic tab pages.

That’s what I’ve found. Surely this is a common use case?

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">
  </ons-tab>
</ons-tabbar>

<template id="tabTemplate.html">
  <ons-page class="tabpage">
    <p style="text-align: center;">
     This is page {{data-pagenumber}}.
    </p>
  </ons-page>
</template>

Is it possible to specify the content of an <ons-tab> element inline? i.e. without specifying a page attribute?
I’m trying to create dynamic tab pages during a ons-page init event.

It would be idea to specify tab content like this, so I can use jQuery to add the required tab content elements at runtime:

<ons-tabbar swipeable position="auto" hide-tabs="true" id="tab">
  <ons-tab label="Tab 1">
    <ons-page>
      tab 1 data here
    </ons-page>
  </ons-tab>

  <ons-tab label="Tab 2">
    <ons-page>
      tab 2 data here
    </ons-page>
  </ons-tab>
</ons-tabbar>