Software Archive
Read-only legacy content
17060 Discussions

Tab-Control issues with Ionic Framework

Christine_K_
Beginner
318 Views

Hi there,

I work with the XDK Designer and the Ionic Framework. Now I´m at a point where I need to use the Tab-Control. But I can´t figure out how to design the Content of a tab-item?!

I´m looking forward for your help.
Christine

0 Kudos
1 Reply
Chris_P_Intel
Employee
318 Views

In Ionic the tabs need to be hooked up to an Angular directive that helps bring in an external file of tab content.

Here are the docs on the tabs: http://ionicframework.com/docs/components/#tabs    and those docs pretty much just tell you how to style the tab-items and tab-bar, etc.  For "making it actually work", they direct you to here: http://ionicframework.com/docs/api/directive/ionTabs/  And all of that is well and good if you are breathing Angular and Ionic ever day. But if you are approaching it for the first time, it's a lot to take in. 

This tutorial may help: https://blog.nraboy.com/2014/12/understanding-tabs-ionic-framework/

Long story short: the tab content is included via a second external file.   And this will have to be coded up by hand. The Design View doesn't have the features needed to do this all via drag-and-drop.  It does for Bootstrap tabs and a few other frameworks where tabs are just simple HTML constructs, but not for Ionic with its more sophisticated approach.

Hope this helps,

Chris

 

0 Kudos
Reply