AngularJS UI Router $state reload child state only

Question

I am using UI router for tabs of a main menu as well as for links within one of the states (users). The users state has a list of users and when a user is clicked, I want t

Answer 1

As documented in API Reference , we can use $state.reload:

$state.reload(state)

A method that force reloads the current state. All resolves are re-resolved, controllers reinstantiated, and events re-fired.

Parameters:

• state (optional)
  • A state name or a state object, which is the root of the resolves to be re-resolved.

An example:

//will reload 'contact.detail' and 'contact.detail.item' states
$state.reload('contact.detail');

Similar we can achieve with a $state.go() and its options parameter:

$state.go(to, params, options)

...

• options (optional)
  • location ...
  • inherit ...
  • relative ...
  • notify ...
  • reload (v0.2.5) - {boolean=false|string|object}, If true will force transition even if no state or params have changed. It will reload the resolves and views of the current state and parent states. If reload is a string (or state object), the state object is fetched (by name, or object reference); and \ the transition reloads the resolves and views for that matched state, and all its children states.

Example from https://github.com/angular-ui/ui-router/issues/1612#issuecomment-77757224 by Chris T:

{ reload: true } // reloads all,
{ reload: 'foo.bar' } // reloads top.bar, and any children
{ reload: stateObj } // reloads state found in stateObj, and any children

An example

$state.go('contact', {...}, {reload: 'contact.detail'});