Configurez votre service en tant que fournisseur AngularJS personnalisé
Malgré ce que dit la réponse Acceptée, vous POUVEZ faire ce que vous aviez l'intention de faire, mais vous devez le configurer en tant que fournisseur configurable, afin qu'il soit disponible en tant que service pendant la phase de configuration. Commencez par changer votre Service
fournisseur. comme indiqué ci-dessous. La principale différence ici est qu'après avoir défini la valeur de defer
, vous définissez la defer.promise
propriété sur l'objet de promesse renvoyé par $http.get
:
Service fournisseur: (fournisseur: recette de service)
app.provider('dbService', function dbServiceProvider() {
//the provider recipe for services require you specify a $get function
this.$get= ['dbhost',function dbServiceFactory(dbhost){
// return the factory as a provider
// that is available during the configuration phase
return new DbService(dbhost);
}]
});
function DbService(dbhost){
var status;
this.setUrl = function(url){
dbhost = url;
}
this.getData = function($http) {
return $http.get(dbhost+'db.php/score/getData')
.success(function(data){
// handle any special stuff here, I would suggest the following:
status = 'ok';
status.data = data;
})
.error(function(message){
status = 'error';
status.message = message;
})
.then(function(){
// now we return an object with data or information about error
// for special handling inside your application configuration
return status;
})
}
}
Maintenant, vous avez un fournisseur personnalisé configurable, il vous suffit de l'injecter. La principale différence ici étant le "fournisseur sur votre injectable" manquant.
config:
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: "partials/editor.html",
controller: "AppCtrl",
resolve: {
dbData: function(DbService, $http) {
/*
*dbServiceProvider returns a dbService instance to your app whenever
* needed, and this instance is setup internally with a promise,
* so you don't need to worry about $q and all that
*/
return DbService('http://dbhost.com').getData();
}
}
})
});
utiliser des données résolues dans votre appCtrl
app.controller('appCtrl',function(dbData, DbService){
$scope.dbData = dbData;
// You can also create and use another instance of the dbService here...
// to do whatever you programmed it to do, by adding functions inside the
// constructor DbService(), the following assumes you added
// a rmUser(userObj) function in the factory
$scope.removeDbUser = function(user){
DbService.rmUser(user);
}
})
Alternatives possibles
L'alternative suivante est une approche similaire, mais permet à la définition de se produire dans le .config
, encapsulant le service dans le module spécifique dans le contexte de votre application. Choisissez la méthode qui vous convient. Voir également ci-dessous pour des notes sur une troisième alternative et des liens utiles pour vous aider à comprendre toutes ces choses.
app.config(function($routeProvider, $provide) {
$provide.service('dbService',function(){})
//set up your service inside the module's config.
$routeProvider
.when('/', {
templateUrl: "partials/editor.html",
controller: "AppCtrl",
resolve: {
data:
}
})
});
Quelques ressources utiles
- John Lindquist a une excellente explication et démonstration de 5 minutes sur egghead.io , et c'est l'une des leçons gratuites! J'ai essentiellement modifié sa démonstration en la rendant
$http
spécifique dans le cadre de cette demande
- Voir le guide du développeur AngularJS sur les fournisseurs
- Il y a aussi une excellente explication sur
factory
/ service
/ provider
sur clevertech.biz .
Le fournisseur vous donne un peu plus de configuration sur la .service
méthode, ce qui la rend meilleure en tant que fournisseur de niveau application, mais vous pouvez également l'encapsuler dans l'objet de configuration lui-même en l'injectant $provide
dans la configuration comme ceci: