Monaca Onsen UI Discord Chat Github Repo

Define <ons-tab> content inline (without a 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>
    

  • administrators

    As far as I can see, the only way to specify the page is with the page attribute. The inline content is the content of the tab itself, not the page the tab points to.

    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.



  • @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?