Come posso passare i dati tra stati con ui-router angolare?

Question

Originariamente non avevo intenzione di fare il progetto con l'ui-router (ne sono venuto a conoscenza 2 giorni fa), quindi sono abbastanza nuovo in questo.

quello che ho per questa edizione è:

1. Modello per la lista di immagini, mostrato utilizzando ng-repeat, e ottenere img-src da un servizio chiamato nel controller. Il servizio ottiene la fonte da un file JSON.

2. Modello per editor di immagini. Il controller per questo dovrebbe ottenere la sorgente dell'immagine dell'immagine che è stata cliccata nell'elenco delle immagini.

Come passare la sorgente di immagine da uno stato (l'elenco di immagini) a un altro stato (l'editor di immagini)?

Stavo usando un servizio per farlo quando supponevo che non usassi l'ui-router e i suoi stati. Come posso fare questo con gli stati?

Answer 1

Così, ho trovato un modo semplice ed efficace per passare i dati, e questo ha funzionato per tutti i miei casi fino ad ora. (Inclusi gli scenari differenti da quello indicato nella domanda originale)

Nel controllore del primo stato, stato1, posso solo chiamare la funzione

$state.go('state2', {id: self.value}); 

E Stato2, è possibile ottenere il valore da il seguente codice:

this.state2value = $state.params.id; 

Così può passare value da uno stato all'altro, e recuperare attraverso params statali.

Nota: è necessario immettere $ state e $ stateParams in entrambi i controller.

Answer 2

penso che si può passare un ID immagine dallo stato 1 allo stato 2, e lo fanno nello stato 2 regolatore:

$stateProvider 
.state('state', { 
    url: "/test/:id", 
    templateUrl: 'template.html', 
    controller: function ($stateParams) { 
     console.log($stateParams.id); 
    } 
}) 

e il link dalla prima pagina ui-sref="state({id:42})"

Answer 3

servizio sembra ancora essere la tua migliore opzione per condividere informazioni tra due stati. Se avete bisogno di informazioni sullo stato in servizio si può solo iniettare $ Stato in esso:

...... 
.service('SomeService', [ 
     '$state', 
     function ($state) { 
      .......