La domanda principale: è possibile? Ho provato senza fortuna ..
app.js principale
...
var app = angular.module('myApp', ['services']);
app.config(['customProvider', function (customProvider) {
}]);
...provider stesso
var services = angular.module('services', []);
services.provider('custom', function ($http) {
});E ho un tale errore:
Uncaught Error: Unknown provider: $http from services Qualche idea?
Grazie!
app.configparte
Risposte:
Il framework angolare ha un processo di inizializzazione in 2 fasi:
Durante la configfase vengono inizializzati tutti i provider e configvengono eseguite tutte le sezioni. Le configsezioni possono contenere codice che configura gli oggetti provider e quindi possono essere iniettati con oggetti provider. Tuttavia, poiché i provider sono le fabbriche per gli oggetti del servizio e in questa fase i provider non sono completamente inizializzati / configurati -> non puoi chiedere al provider di creare un servizio per te in questa fase -> nella fase di configurazione non puoi usare / iniettare servizi . Quando questa fase è completata, tutti i provider sono pronti (non è più possibile eseguire la configurazione del provider dopo il completamento della fase di configurazione).
Durante la runfase runvengono eseguite tutte le sezioni. In questa fase i provider sono pronti e possono creare servizi -> durante la runfase è possibile utilizzare / iniettare servizi .
$httpservizio nella funzione di inizializzazione del provider NON funzionerà//ERRONEOUS angular.module('myModule').provider('myProvider', function($http) { // SECTION 1: code to initialize/configure the PROVIDER goes here (executed during `config` phase) ... this.$get = function() { // code to initialize/configure the SERVICE goes here (executed during `run` stage) return myService; }; });
Dato che stiamo cercando di iniettare il $httpservizio in una funzione che viene eseguita durante la configfase, otterremo un errore:
Uncaught Error: Unknown provider: $http from services
Ciò che questo errore sta effettivamente dicendo è che il file $httpProviderutilizzato per creare il $httpservizio non è ancora pronto (poiché siamo ancora in configfase).
$httpservizio per l'inizializzazione servizio funzione WILL lavoro://OK
angular.module('myModule').provider('myProvider', function() {
// SECTION 1: code to initialize/configure the PROVIDER goes here (executed during `config` phase)
...
this.$get = function($http) {
// code to initialize/configure the SERVICE goes here (executed during `run` stage)
return myService;
};
});Poiché ora stiamo iniettando il servizio nella funzione di inizializzazione del servizio, che viene eseguita durante la runfase, questo codice funzionerà.
<script>var config = <% = mySettings.toJson() %>;</script>). Questo può essere fatto utilizzando un motore di template come Smarty per PHP, Jinja2 per Python, Nunchucks per NodeJS, ecc.
Questo potrebbe darti una piccola leva:
var initInjector = angular.injector(['ng']);
var $http = initInjector.get('$http');Ma fai attenzione, i callback di successo / errore potrebbero mantenerti in una condizione di competizione tra l'avvio dell'app e la risposta del server.
angular.injector(['mymodule']), ma non sono sicuro che tu possa utilizzare questo approccio per il $httpservizio. Voglio dire che l'ho fatto però. Non sono sicuro se questo aiuti o meno: - /
Questa è una vecchia domanda, sembra che abbiamo qualcosa da fare se vogliamo fare affidamento sulle funzionalità principali della libreria.
Invece di risolvere il problema in modo fondamentale, quello che ho fatto è bypassare. Crea una direttiva che avvolga l'intero corpo. Ex.
<body ng-app="app">
<div mc-body>
Hello World
</div>
</body>Ora mc-bodydeve essere inizializzato prima del rendering (una volta), es.
link: function(scope, element, attrs) {
Auth.login().then() ...
}Auth è un servizio o un fornitore, es.
.provider('Auth', function() {
... keep your auth configurations
return {
$get: function($http) {
return {
login: function() {
... do something about the http
}
}
}
}
})Mi sembra di avere il controllo sull'ordine del bootstrap, è dopo che il bootstrap regolare risolve tutta la configurazione del provider e quindi prova a inizializzare la mc-bodydirettiva.
E questa direttiva mi sembra possa essere prima del routing, perché anche il routing viene iniettato tramite una direttiva ex. <ui-route />. Ma posso sbagliarmi su questo. Ha bisogno di ulteriori indagini.
In risposta alla tua domanda "Qualche idea?", Avrei risposto con "sì". Ma aspetta, c'è di più!
Suggerisco di usare solo JQuery nel file config. Per esempio:
var app = angular.module('myApp', ['services']);
app.config(['$anyProvider', function ($anyProvider) {
$.ajax({
url: 'www.something.com/api/lolol',
success: function (result) {
$anyProvider.doSomething(result);
}
});
}]);