Collegamento di funzioni e dati globali a $ rootScope all'inizializzazione in AngularJS

Mi piacerebbe avere una "funzione globale" chiamata la prima volta che lancio la mia applicazione AngularJS o ogni volta che aggiorno la pagina.

Questa funzione chiamerà il mio server con $http.get() per ottenere le informazioni globali necessarie per utilizzare la mia applicazione. Devo accedere a $rootScope in questa funzione. Dopodiché, e solo dopo aver completato questa richiesta, sto utilizzando app.config e $routeProvider.when() per caricare il buon controller.

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
     .when('/', 
     { 
      /**/ 
     }); 
}]);

Non voglio che l'applicazione faccia qualcosa prima che questa azione sia finita. Quindi penso di dover usare una "risoluzione", ma non so davvero come usarla.

Qualche idea?

Grazie!

fonte

2013-04-01 alexmngn

Non è * possibile eseguire una richiesta '$ http' prima di eseguire i blocchi' config'. I blocchi 'run' verranno eseguiti immediatamente * dopo * i blocchi' config', che è il punto più rapido in cui è possibile farlo. Inoltre, non si devono memorizzare i dati in '$ rootScope', ma in un servizio. Perché ritieni di aver bisogno delle informazioni prima di configurare il routing? –

Sto provando a creare un sito Web internazionale, multilingue. 1. Ottieni le traduzioni dal server (funzione Global!) E inserisci questi dati nel rootScope (tutte le traduzioni, per evitare che l'utente carichi le traduzioni ogni volta che cambia pagina, e per evitare che io elenchi tutte le parole chiave di cui ho bisogno per ogni Se hai un'altra idea per ottenere l'elenco di parole chiave utilizzate in un modello e caricare la traduzione dopo che il modello è stato caricato potrebbe essere utile) 2. Impostazione del routing 3. Esegui il controller, display. – alexmngn

Le traduzioni dovrebbero essere in un servizio di sicuro. Ci sono servizi là fuori se vuoi qualcosa fuori dalla scatola, come [questo] (https://github.com/PascalPrecht/ng-translate) - dovrebbe fornire ispirazione se non altro. Ma non hai ancora risposto perché hai bisogno delle traduzioni prima di impostare il routing. –

Non è il modo migliore per risolvere il problema, ma ecco una soluzione proposta per la tua domanda.

Qualsiasi operazione all'interno di run(...) verrà eseguita sull'inizializzazione.

angular.module('fooApp').run(['$http', '$rootScope' function($http, $rootScope) { 
$http.get(...).success(function(response) { 
    $rootScope.somedata = response; 
}); 

$rootScope.globalFn = function() { 
    alert('This function is available in all scopes, and views'); 
} 

}]);

Ora un avviso può essere attivato in tutti i vostri punti di vista, utilizzando ng-click="globalFn()".

Essere consapevoli del fatto che le direttive che utilizzano un nuovo ambito isolato non avranno accesso a questi dati, se non esplicitamente ereditato:$scope.inheritedGlobalFn = $rootScope.globalFn

fonte

2013-04-01 23:03:41

Questo non risolve il problema. È probabile che qualsiasi vista che richiede somedata abbia bisogno di quei dati prima che venga restituita la chiamata asincrona in esecuzione, causando errori. Il problema sta nell'incapacità di aspettare qualcosa su ciò che sta accadendo in esecuzione. Ciò di cui c'è bisogno è una risoluzione universale in AngularJS. Al momento non esiste e non ho trovato una soluzione pulita a questo problema. –

Infatti. Se tutti i controller avessero iniettato un servizio che rispondesse con la promessa che era stata attivata in Esegui, avrebbe risolto il problema. Ci vorrà del tempo per fornire un esempio decente in seguito! –

C'è una virgola mancante tra la funzione '' $ rootScope'' e '($ http,';) Impossibile modificare, perché ho bisogno di più caratteri (le modifiche alla tipografia apparentemente non sono richieste su SO) – z3ntu

Come primo passo per la soluzione, penso che si potrebbe monitorare l'evento $ routeChangeStart che viene attivato prima di ogni modifica del percorso (o aggiornamento della pagina nel tuo caso).

var app = angular.module('myApp').run(['$rootScope', function($rootScope) { 
    $rootScope.$on("$routeChangeStart", function (event, next, current) { 
     if (!$rootScope.myBooleanProperty)) { 
      $location.path('/'); 
     } 
     else { 
      $location.path('/page'); 
     } 
    }); 
});

Si dovrebbe avere uno sguardo a this article su Autenticazione in una pagina singola app. Penso che potresti lavorare qualcosa di simile.

fonte

2013-04-04 04:41:00 jpmorin

Si prega di considerare questa risposta: https://stackoverflow.com/a/27050497/1056679

Ho cercato di raccogliere tutti i possibili metodi di risolvere le dipendenze in ambito globale prima dell'esecuzione controllori reali.

fonte

2014-11-25 15:14:31

Collegamento di funzioni e dati globali a $ rootScope all'inizializzazione in AngularJS

risposta

Problemi correlati