angularjs - onsen ui - Include Files -


i have onsen-ui project several pages. have same navigator control on each of these pages. there anyway can extract navigator control out of pages , keep 1 file, import/include file in pages? in c# can create usercontrol , include usercontrol in pages. i'm looking similar in onsen-ui.

consider following:

<ons-page ng-controller="mycontroller myctrl">      <div class="navigation-bar">          <div class="navigation-bar__left">             <ons-toolbar-button ng-click="myctrl.back()"><ons-icon icon="fa-chevron-left"></ons-icon></ons-toolbar-button>         </div>          <div class="navigation-bar__center">             page         </div>          <div class="navigation-bar__right">             <ons-toolbar-button ng-click="myctrl.dosometask()"><ons-icon icon="fa-cog"></ons-icon></ons-toolbar-button>         </div>     </div>      <ons-scroller>         /*... page content...*/     </ons-scroller>  </ons-page> 

the "navigation-bar" div i'd extract out other file , include/import in other pages. can tell me how this?

i figured out. trick use "ng-include".

so in controller-page have:

<ons-page ng-controller="mycontroller myctrl">      <ng-include src="'incnavbar.html'"></ng-include>      <ons-scroller>         /*... page content...*/     </ons-scroller>  </ons-page> 

and have filed called incnavbar.html includes following:

<div class="navigation-bar">      <div class="navigation-bar__left">         <ons-toolbar-button ng-click="myctrl.back()"><ons-icon icon="fa-chevron-left"></ons-icon></ons-toolbar-button>     </div>      <div class="navigation-bar__center">         page     </div>      <div class="navigation-bar__right">         <ons-toolbar-button ng-click="myctrl.dosometask()"><ons-icon icon="fa-cog"></ons-icon></ons-toolbar-button>     </div> </div> 

keep in mind must use both double , single quotes src attribute i've done above.


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -