typescript - Dynamic ion-tabs in ionic 2 using ngFor -
i using ionic 2 application, want dynamic tabs in application, not able that
html
<ion-tabs #maintabs [selectedindex]="myselectedindex"> <ion-tab *ngfor="let circle of circles" [tabroot]="gotomemberlistpage(circle)" title="{{circle.name}}"></ion-tab>\ </ion-tabs>
typescript
gotomemberlistpage(circle) { this.navctrl.push(memberlistpage, circle); }
i don't know whether full or not following below snippet can pass dynamic tabs using ionic 2 , typescript
tabs.html
<ion-tabs> <ion-tab *ngfor="let tab of tabs" [root]="tab.root" [tabtitle]="tab.title" [tabicon]="tab.icon"></ion-tab> </ion-tabs>
tabs.ts
import { component } '@angular/core'; import { navcontroller } 'ionic-angular'; import { aboutpage } '../about/about'; import { contactpage } '../contact/contact'; import { homepage } '../home/home'; @component({ templateurl: 'tabs.html' }) export class tabspage { public tabs; public navctrl: navcontroller constructor() { this.tabs = [ { title: "home", root: homepage, icon: "home" }, { title: "about", root: aboutpage, icon: "information-circle" }, { title: "contact", root: contactpage, icon: "contacts" } ]; } }
Comments
Post a Comment