TaylorMac TaylorMac - 1 year ago 191
AngularJS Question

Angular UI-Router get the current state from within a view

Considering the following states taken from the ui-router documentation:

.state('state1', {
url: '/state1',
templateUrl: 'partials/state1.html'
controller: 'State1Ctrl'
.state('state1.list', {
url: '/list',
templateUrl: 'partials/state1.list.html',

And the controller for "partials/state1.html" for state "state1":

.controller('State1Ctrl', function () {


Is there any built-in feature to determine from within the controller or within the template, what state the controller/template is associated with?

For example:

.controller('State1Ctrl', function ($state) {
console.log($state.this); // state1

And if there is no built-in solution, how would you "decorate" $state or $stateParams, to contain this information?

The only solution I've come up with is to use $state.get() and then find the state with the controller or template value. This seems incredibly messy, though.

Answer Source

Couldn't find this documented anywhere, so I looked in the source code.

There is a data field named $uiView attached to the ui-view element, it contains the view name and the associated state. You can get this state like this:


or even

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download