AngularJS la interfaz de usuario del Router obtener el estado actual de dentro de una vista

Question

Teniendo en cuenta los siguientes estados tomado de la interfaz de usuario de la documentación del router:

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

Y el controlador "partials/state1.html" para el estado "estado1":

.controller('State1Ctrl', function () {

});

¿Hay alguna característica integrada para determinar desde dentro del controlador o dentro de la plantilla, de qué estado de la controladora/plantilla asociada con?

Por ejemplo:

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

Y si no hay solución integrada, ¿cómo se "decorar" $estado o de $stateParams, para contener esta información?

La única solución que he encontrado es usar $estado.get() y, a continuación, encontrar el estado con el controlador o una plantilla de valor.Este parece ser increíblemente complicado, sin embargo.

Answer 1

No se pudo encontrar esto documentado en ningún lugar, así que miré en el código fuente.

Hay un campo de datos llamado $ UIView adjunto al elemento Vista de usuario, contiene el nombre de la vista y el estado asociado.Puede obtener este estado como este:

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

o incluso

elem.inheritedData('$uiView').state

Answer 2

Puede acceder al objeto de configuración de estado actual como este:

$state.current

Para obtener más información, eche un vistazo a la $ documentación estatal .

Answer 3

Puede hacerlo de la siguiente manera,

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

Answer 4

Podemos ver ¿ se define por current estado, mediante la $state.current, revise este ejemplo mostrando:

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"
}

el controlador:

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

  $scope.current = $state.current

});

compruebe que aquí

AMPLIAR:El ejemplo de arriba siempre devolverá estado actual - es decir,si no es la jerarquía de los tres estados y accedemos a la última del estado ('state1.list.detail') directamente:

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

Cada controlador será proporcionado con el mismo estado:$estado("estado1.lista.detalle").

Por qué?beause este estado tiene suficiente información como lo son todos los puntos de vista (jerárquicamente anidada) y sus controladores necesarios.Podemos observar que todos en el

$state.$current // not .current

Rápidamente discute aquí citar:

Además, los usuarios pueden adjuntar personalizado decoradores, lo que generará nuevas propiedades en el estado interno de definición.Actualmente no existe un claro caso de uso para el que esta más allá de acceso interno de los estados (es decir, $state.$current), sin embargo, esperamos que esto se convierta cada vez más relevante a medida que introducimos adicional de meta-programación de funciones.

PERO:NO hay manera, cómo obtener información de actual controlador de instance, a la que $state pertenece!Incluso cualquier iteraciones, buscando a través de algunos $state.get('stateName') ser poco fiable, porque simplemente no hay mantienen relación de esa manera.Un controlador Class podría ser utilizado para muchas opiniones diferentes Instances.Y también, desde mi experiencia, yo no recuerdo ningún caso, cuando yo necesitaba saber esa información...deseo ahora es un poco más claro

Answer 5

Esto es útil si está buscando el nombre actual del estado, $ State.Current.Name

Answer 6

No estoy seguro de que sea la misma versión, pero en 0.3.1 puede usar esto para obtener el estado actual:

$state.$current.name

y para realizar un cheque:

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

Documentación: https:// ui-Router.github.io/ng1/docs/0.3.1/index.html#/api/ui.router.state . $ Estado

Answer 7

un controlador " fuera de la caja" de su código, que muestra el estado:

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

Answer 8

Si desea verificar el estado actual

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

Si desea verificar el nombre del nombre del estado actual

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