Ricarica lo stato corrente – aggiorna i dati

Uso Angular UI Router e vorrei ricaricare lo stato corrente e aggiornare tutti i dati / rieseguire i controller per lo stato corrente ed è padre.

Ho 3 livelli di stato: directory.organisations.details

directory.organisations contiene una tabella con un elenco di organizzazioni. Facendo clic su un elemento nella tabella viene caricato directory.organisations.details con $ StateParams che passano l’ID dell’articolo. Quindi nello stato dei dettagli caricherò i dettagli per questo articolo, li modificherò e quindi salverò i dati. Tutto bene finora.

Ora ho bisogno di ricaricare questo stato e aggiornare tutti i dati.

Ho provato:

$state.transitionTo('directory.organisations'); 

Che va allo stato genitore ma non ricarica il controller, credo perché il percorso non è cambiato. Idealmente, voglio solo rimanere nello stato directory.organisations.details e aggiornare anche tutti i dati nel genitore.

Ho anche provato:

 $state.reload() 

Ho visto questo sull’API WIKI per $ state.reload “(bug con i controller che si stanno riprendendo proprio adesso, che si aggiusta presto).”

Qualsiasi aiuto sarebbe apprezzato?

Ho trovato che questo è il modo più semplice di funzionare per aggiornare con ui-router:

 $state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams 

Aggiornamento per le versioni più recenti:

 $state.reload(); 

Quale è un alias per:

 $state.transitionTo($state.current, $stateParams, { reload: true, inherit: false, notify: true }); 

Documentazione: https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload

Questa soluzione funziona in AngularJS V.1.2.2:

 $state.transitionTo($state.current, $stateParams, { reload: true, inherit: false, notify: true }); 

Questa sarebbe la soluzione finale. (ispirato al post di @ Hollan_Risley)

 'use strict'; angular.module('app') .config(function($provide) { $provide.decorator('$state', function($delegate, $stateParams) { $delegate.forceReload = function() { return $delegate.go($delegate.current, $stateParams, { reload: true, inherit: false, notify: true }); }; return $delegate; }); }); 

Ora, ogni volta che devi ricaricare, chiama semplicemente:

 $state.forceReload(); 

per quadro ionico

 $state.transitionTo($state.current, $state.$current.params, { reload: true, inherit: true, notify: true });//reload $stateProvider. state('home', { url: '/', cache: false, //required 

https://github.com/angular-ui/ui-router/issues/582

Probabilmente l’approccio più pulito sarebbe il seguente:

 Details State 

Possiamo ricaricare lo stato solo da HTML.

La risposta di @Holland Risley è ora disponibile come apice nell’ultimo ui-router.

 $state.reload(); 

Un metodo che forza ricarica lo stato corrente. Tutte le risoluzioni vengono risolte di nuovo, i controllori vengono reinizializzati e gli eventi riaccesi.

http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state

 $state.go($state.current, $stateParams, {reload: true, inherit: false}); 
 $scope.reloadstat = function () { $state.go($state.current, {}, {reload: true}); }; 

se vuoi ricaricare la tua intera pagina, come sembra, inserisci semplicemente $ window nel tuo controller e poi chiama

 $window.location.href = '/'; 

ma se si desidera ricaricare la vista corrente, iniettare $ scope, $ state e $ stateParams (quest’ultimo nel caso in cui sia necessario modificare alcuni parametri in questo prossimo caricamento, qualcosa come il numero di pagina), quindi chiamare questo all’interno di qualsiasi metodo del controller:

 $stateParams.page = 1; $state.reload(); 

AngularJS v1.3.15 angular-ui-router v0.2.15

Sciocchezza che funziona sempre.

 $state.go("otherState").then(function(){ $state.go("wantedState") }); 

Per angular v1.2.26, nessuno dei precedenti funziona. Un ng-click che richiama i metodi sopra dovrà essere cliccato due volte per far ricaricare lo stato.

Così ho finito per emulare 2 clic utilizzando $ timeout.

 $provide.decorator('$state', ["$delegate", "$stateParams", '$timeout', function ($delegate, $stateParams, $timeout) { $delegate.forceReload = function () { var reload = function () { $delegate.transitionTo($delegate.current, angular.copy($stateParams), { reload: true, inherit: true, notify: true }) }; reload(); $timeout(reload, 100); }; return $delegate; }]); 

Tutto ha fallito per me. L’unica cosa che ha funzionato … è l’aggiunta di cache-view = “false” nella vista che voglio ricaricare quando ci si reca.

da questo numero https://github.com/angular-ui/ui-router/issues/582

Non sono sicuro del motivo per cui nessuno di questi sembra funzionare per me; quello che alla fine ha fatto è stato:

 $state.reload($state.current.name); 

Questo era con Angular 1.4.0

Avevo più viste nidificate e l’objective era quello di ricaricare solo uno con il contenuto. Ho provato approcci diversi ma l’unica cosa che ha funzionato per me è:

 //to reload $stateParams.reload = !$stateParams.reload; //flip value of reload param $state.go($state.current, $stateParams); //state config $stateProvider .state('app.dashboard', { url: '/', templateUrl: 'app/components/dashboard/dashboard.tmpl.html', controller: 'DashboardController', controllerAs: 'vm', params: {reload: false} //add reload param to a view you want to reload }); 

In questo caso, solo la visualizzazione necessaria verrebbe ricaricata e il caching funzionerebbe ancora.

So che ci sono state un sacco di risposte, ma il modo migliore che ho trovato per fare questo senza causare un aggiornamento completo della pagina è quello di creare un parametro fittizio sul percorso che voglio aggiornare e poi quando chiamo il percorso che passo in un numero casuale al parametro fittizio.

  .state("coverage.check.response", { params: { coverageResponse: null, coverageResponseId: 0, updater: 1 }, views: { "coverageResponse": { templateUrl: "/Scripts/app/coverage/templates/coverageResponse.html", controller: "coverageResponseController", controllerAs: "vm" } } }) 

e poi la chiamata a quella rotta

 $state.go("coverage.check.response", { coverageResponse: coverage, updater: Math.floor(Math.random() * 100000) + 1 }); 

Funziona come un fascino e gestisce le risoluzioni.

Puoi utilizzare @Rohan answer https://stackoverflow.com/a/23609343/3297761

Ma se vuoi fare in modo che ogni controller si riattivi dopo un cambio di visualizzazione puoi usare

 myApp.config(function($ionicConfigProvider) { $ionicConfigProvider.views.maxCache(0); ... } 

Ho avuto questo problema che mi stava rovinando la testa, il mio routing è stato letto da un file JSON e poi inserito in una direttiva. Potrei cliccare su un ui-state ma non ho potuto ricaricare la pagina. Quindi un mio collega mi ha mostrato un piccolo trucco per questo.

  1. Ottieni i tuoi dati
  2. Nella tua app config crea uno stato di caricamento
  3. Salva lo stato in cui vuoi andare nel rootcope.
  4. Imposta la tua posizione su “/ caricamento” nella tua app.run
  5. Nel controller di caricamento, risolvere la promise di routing e quindi impostare la posizione sulla destinazione desiderata.

Questo ha funzionato per me.

Spero che sia d’aiuto

Se si utilizza la v1 ionica, la soluzione di cui sopra non funzionerà poiché ionic ha abilitato la memorizzazione nella cache del modello come parte di $ ionicConfigProvider.

Lavorare per questo è un po ‘hacky – devi impostare la cache su 0 nel file ionic.angular.js:

 $ionicConfigProvider.views.maxCache(0);