When using Ionic and AngularJS, you must implement routes in order to create regular navigation in the application that you are building. Doing so in Ionic is unique because it does not use the default route provider service. Learn how to implement your first route in this online video, which includes configuring a particular state, modifying tabs, and much more.
- In the last video, we learned how routing is…a little bit different in Ionic because it doesn't use…the default route provider service.…In this video, we'll start implementing routes the Ionic way…so that we can have regular navigation in our application.…Here's a sample app.…So you'll notice that we have these different tabs.…And even within Artists,…we can get more information about the artist,…and we have this Back button that lets us go back.…So the first thing we're gonna need to do in our app is,…go to the index.html page…and find everything underneath the body tag…and just get rid of it.…
So we're gonna grab all the way into this ion pane…and I'm gonna cut that.…And I'm gonna place this in a new file.…So I'm gonna create a folder in the www folder,…and I'm gonna call this templates.…And I'll create a file in there…which I'm going to save as list.html.…And I'm gonna paste the contents of my clipboard.…Now, because we're gonna be using tabs instead of panes,…I'll remove the ion-panes tag that we got…when we installed the default blank template from Ionic.…
- Installing the development environment on Mac or PC
- Understanding the Ionic templates and CSS components
- Adding IonicIcons to a layout
- Adding tabs, cards, and lists
- Using form elements
- Building a single view app
- Implementing Pull to Refresh
- Creating a multi-tab app
- Styling the applications
- Deploying applications
Skill Level Intermediate
1. Getting Started
2. Using Ionic CSS Components
3. Building a Single-View App
4. Creating a Multi-Tab Application
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.