AngularJS UI-Router получает текущее состояние из вида

Учитывая следующие состояния, взятые из документации ui-router:

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

И контроллер для "partials/state1.html" для состояния "state1":

.controller('State1Ctrl', function () {

});

Есть ли встроенная функция для определения внутри контроллера или внутри шаблона, с какими состояниями связан контроллер/шаблон?

Например:

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

И если нет встроенного решения, как бы вы "украсили" $state или $stateParams, чтобы содержать эту информацию?

Единственное решение, с которым я столкнулся, это использовать $state.get(), а затем найти состояние с параметром контроллера или шаблона. Это кажется невероятно грязным, однако.

Ответы

Ответ 1

Не удалось найти документацию в любом месте, поэтому я просмотрел исходный код.

Имеется поле данных с именем $uiView, прикрепленное к элементу ui-view, оно содержит имя представления и соответствующее состояние. Вы можете получить это состояние следующим образом:

elem.closest('[ui-view]').data('$uiView').state

или даже

elem.inheritedData('$uiView').state

Ответ 2

Вы можете получить доступ к объекту конфигурации текущего состояния следующим образом:

$state.current

Для получения дополнительной информации посмотрите документацию $ state.

Ответ 3

Вы можете сделать это, как следует,

$state.current.name //Return the name of current state

Ответ 4

Мы можем видеть, что определено для состояния current, используя $state.current, проверьте этот пример показ:

state1
{
  "url": "/state1",
  "template": "<div>state1 <pre>{{current | json }}</pre><div ui-view=\"\"></div> </div>",
  "controller": "State1Ctrl",
  "name": "state1"
}
list
{
  "url": "/list",
  "template": "<div>list <pre>{{current | json }}</pre></div>",
  "controller": "State1Ctrl",
  "name": "state1.list"
}

контроллер:

.controller('State1Ctrl', function($scope, $state) {

  $scope.current = $state.current

});

проверьте, что здесь

EXTEND: приведенный выше пример всегда будет возвращать текущее состояние - т.е. если существует иерархия из трех состояний, и мы напрямую обращаемся к последнему состоянию ('state1.list.detail'):

<a ui-sref="state1.list.detail({detailId:1})">....

Каждый контроллер будет иметь одно и то же состояние: $state ( "state1.list.detail" ).

Почему? потому что в этом состоянии достаточно информации, каковы все представления (иерархически вложенные) и их контроллеры. Мы можем заметить, что все в

$state.$current // not .current

Быстро обсуждаемый здесь cite:

Кроме того, пользователи могут присоединять пользовательские декораторы, которые будут генерировать новые свойства внутри внутреннего внутреннего определения. В настоящее время нет четкого варианта использования для этого без доступа к внутренним состояниям (т.е. $state.$current), однако ожидайте, что это станет все более актуальным, поскольку мы вводим дополнительные функции метапрограммирования.

НО: нет способа, как получить информацию от текущего контроллера instance, к которому относится $state! Даже любые итерации, просматриваемые через некоторый $state.get('stateName'), будут ненадежными, потому что просто нет поддерживаемого отношения таким образом. Один контроллер Class может использоваться для многих представлений как разные Instances. А также, по моему опыту, я не помню ни одного случая, когда мне нужно было знать такую ​​информацию... желаю теперь немного более ясно

Ответ 5

Это полезно, если вы ищете текущее состояние, $state.current.name

Ответ 6

Не уверен, что это та же версия, но на 0.3.1 вы можете использовать это, чтобы получить текущее состояние:

$state.$current.name

И выполнить проверку:

$state.is('contact.details.item');

Документация: https://ui-router.github.io/ng1/docs/0.3.1/index.html#/api/ui.router.state. $ State

Ответ 7

Если вы хотите проверить текущее состояние

console.log("state", $state.current)

Если вы хотите проверить имя текущего состояния имени

console.log("statename", $state.current.name)

Ответ 8

Работающий "из коробки" Контроллер из вашего кода, который показывает состояние:

.controller('State1Ctrl', function ($state) {
    console.log("Current State: ", $state.current.name);
});