How abstract states work in Ionic?

Question

How abstract states work? What is the purpose of the abstract tabs? What is the purpose of the template included in abstract tab? Can I have more than one abstract states? Can I switch from one state to another which are in different abstract states?

I modified the app.js to have 2 abstract states from the default tab template. https://gist.github.com/ashoksahoo/6bcad2c62e1abaa3de74

But I cant get index.html#/friend/:id working, and FriendDetailCtrl is also not firing.

Answer 1

Abstract states cannot be navigated to. Their purpose is to have several (non-abstract) states share a common parent, without having to define a parent state that can be navigated to.

This can be useful in many situations. See here: https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#abstract-states

You can have many abstract states. You can use $state.go() to switch between any two states, even if they have different parents, abstract or not.

Your URL index.html#/friend/:id looks strange. tab.triends has an argument. friend does not.

The proper URL for the friends state is: /#/tab/friends/1234

For the friend state (no argument!): /#/friend