L'ui-router angolare ha lo stato attuale dall'interno di una vista

Question

Considerando i seguenti stati presi dalla documentazione del router UI:

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

.

E il controller per "Partials / State1.html" per stato "State1":

.controller('State1Ctrl', function () {

});

.

Esiste una funzione integrata per determinare all'interno del controller o all'interno del modello, in che tipo è associato il controller / template?

Ad esempio:

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

.

E se non c'è soluzione integrata, come vorresti "decorare" $ State o $ Stateparams, per contenere queste informazioni?

L'unica soluzione che ho inventato è usare $ stato.get () e quindi trovare lo stato con il controller o il valore del modello.Questo sembra incredibilmente disordinato, però.

Answer 1

Impossibile trovare questo documentato da nessuna parte, quindi ho guardato nel codice sorgente.

C'è un campo dati denominato $ UIView collegato all'elemento UI-View, contiene il nome della vista e lo stato associato.Puoi ottenere questo stato come questo:

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

.

o anche

elem.inheritedData('$uiView').state

.

Answer 2

È possibile accedere all'oggetto di configurazione di stato corrente come questo:

$state.current

.

Per ulteriori informazioni Dai un'occhiata a $ Documentazione di stato .

Answer 3

Puoi farlo come segue,

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

.

Answer 4

Possiamo vedere Che cosa è definito per lo stato current, utilizzando il $state.current , controlla questo Esempio 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"
}

.

Il controller:

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

  $scope.current = $state.current

});

.

Verifica che qui

Estendi: L'esempio sopra riporterà sempre lo stato attuale - I.e. Se c'è una gerarchia di tre stati e accediamo direttamente all'ultimo stato ('state1.list.detail'):

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

.

Ogni controller verrà fornito con lo stesso stato: $ stato ("stato1.list.detail").

Perché? Beause Questo stato ha informazioni sufficienti quali sono tutti i punti di vista (nidificati gerarchicamente) ei loro controller necessari. Possiamo osservare tutto ciò nel

$state.$current // not .current

.

Discusso rapidamente qui Cita:

.

Inoltre, gli utenti possono allegare decorati personalizzati, che genereranno nuove proprietà all'interno della definizione interna dello Stato. Attualmente non vi è alcun custodia chiare per questo oltre ad accedere agli stati interni (cioè $state.$current ), tuttavia, si aspettano che questo diventi sempre più rilevante mentre introduciamo ulteriori funzioni di meta-programmazione.

Ma: non c'è modo, come ottenere informazioni dal controller attuale instance, a quale $state appartiene! Anche eventuali iterazioni, la ricerca attraverso alcuni $state.get('stateName') saranno inaffidabili, perché semplicemente non c'è alcuna relazione tenuta in questo modo. Un controller Class può essere utilizzato per molte viste come diverso Instances. E anche, dalla mia esperienza, non ricordo nessun caso, quando avevo bisogno di sapere tali informazioni ... Wish ora è un po 'più chiaro

Answer 5

Questo è utile se stai cercando il nome dello stato corrente, $ stato.current.name

Answer 6

Non è sicuro che sia la stessa versione, ma su 0.3.1 è possibile utilizzare questo per ottenere lo stato corrente:

$state.$current.name

.

e per eseguire un assegno:

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

.

Documentazione: https:// ui-Router.github.io/ng1/docs/0.3.1/index.html#/api/ui.router.state . $ State

Answer 7

A working " fuori dal controller" dal tuo codice, che mostra lo stato:

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

.

Answer 8

Se si desidera controllare lo stato corrente

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

Se si desidera controllare il nome del nome dello stato corrente

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