How to add tabs dynamically from json

Hi, How to add tabs dynamically from the json obtained. My ts file returns the json with tab title, icon and component. My HTML is like below
<ion-tabs>
<div *ngFor="#tab of tabs">
<ion-tab [root] = "tab.component" [tabTitle]="tab.name" [tabIcon]="tab.icon"></ion-tab>
</div>
</ion-tabs>

Since my component is a json string, assigning it to the root didn’t set the navigation. I tried to use the (select)=openTab(tab.component) instead of root. But the params in the method remains undefined. Please help me on this.

Any success on this?

I have not found any best solution so far. Just tried the below method to achieve my need.

this.ser.getPages().subscribe(tabData => {
                    for (var key in tabData) {
                        switch (tabData[key].component) {
                            case 'GridPage':
                                tabData[key].component = GridPage;
                                break;
                            case 'ListPage':
                                tabData[key].component = ListPage;
                                break;
                    }
this.check = tabData;
this.nav.setRoot(<any>TabsPage, this.check);