How works Angularjs UI-Router

Question

I am trying to understand what exactly the parent attribute inside the state directive in UI-Router does.

For example, if I have:

$stateProvider
.state('base', {
    abstract: true,
    url: '',
    templateUrl: 'views/base.html'
})
.state('login', {
  url: '/login',
  parent: 'base',
  templateUrl: 'views/login.html',
  controller: 'LoginCtrl'
})

When I´m inside the login state, what things of the "base" parent will I have at my disposal? The template, its scope, what exactly? What does the abstract attribute of the "base" state do?

Answer 1

What does the 'abstract' attribute of the "base" state do?

It simply make that state 'abstract'. An abstract state can have child states but can not get activated itself.

That is, you cannot do $state.go('base') since its abstract. An 'abstract' state is simply a state that can't be transitioned to.

When I´m inside the login state, what things of the "base" parent will I have at my disposal?

login state being a child state of base, inherit the url property of its parent as a prefix of its own url. It also inherit the following from its parent:

• Resolved dependencies via resolve
• Custom data properties

Yes, parent's scope is also accessible to its child state. Nothing else is inherited (no controllers, templates etc).

Source: Angular ui-router wiki