Using Ionic and Angular

In the last recipe, we created an Instagram clone layout using tab templates. We created the layout using the components of the Ionic UI. We skipped the use of AngularJS in our app. In this recipe, we are going to explore and take advantage of AngularJS's controllers, router, and models in our Ionic application.

How to do it...

To start taking advantage of AngularJS's features in an Ionic application, follow these steps:

1. We will continue building the ionSnap app that we created in the previous recipe. Open the terminal, change the directory to ionSnap, and run the Ionic server:

   cd path/to/ionSnap
   ionic serve
   

2. Open www/js/app.js and examine it. The app.js is the main entry of our app. There is a bunch of configurations, but for now, we will explore the router only. We can configure each state of our app. Each state holds the configuration of the URL, which template is used, and the name of the controller. The router configuration will look like this:

   .state('tab.dash',...