Creating a tab interface with nested views
This recipe will explain how to work with the Ionic tab interface and expand it for other use cases. For example, it's possible to have additional views (that is, children) within each tab. Since each tab has its own view and state, you can also watch the tab change event. The following is the screenshot of the app:
In this app, you will learn the following:
- How to create nested views and states
- How to create a custom title per view
- How to watch for state changes and inject your own conditions depending on the new state
You will also use $ionicLoading
, which is a very useful directive if you need to temporarily show some content on the screen (that is, a loading indicator).
Getting ready
Since AngularJS UI-Router comes with the Ionic bundle, there is no need to download an external library. You can test this in a web browser as well.
How to do it...
Here are the steps to create a tab interface with nested views:
- Create a new app using the blank template...