Maison > interface Web > js tutoriel > le corps du texte

Explication détaillée de la mise en cache $http dans AngularJS et comment gérer plusieurs requêtes $http_AngularJS

WBOY
Libérer: 2016-05-16 15:16:09
original
1527 Les gens l'ont consulté

$http est un service principal d'AngularJS, utilisé pour lire les données des serveurs distants. Dans les projets AngularJS réels, il est souvent nécessaire de traiter plusieurs requêtes $http. Chaque requête $http renvoie une promesse. Nous pouvons mettre plusieurs promesses dans un argument de tableau accepté par la méthode $q.all().

1. Gérer plusieurs requêtes $http

angular.module('app',[])
.controller('AppCtrl', function AppCtrl(myService){
var app = this;
myService.getAll().then(function(info){
app.myInfo = info;
})
})
.service('myService', function MyService($http, $q){
var myService = this;
user = 'https://api...',
repos = '',
events = '';
myService.getData = function getData(){
return $http.get(user).then(function(userData){
return {
name:userData.data.name,
url:userData.data.url,
repoCount: userData.data.count
}
})
};
myService.getUserRepos = function getUserRepos(){
return $http.get(repos).then(function(response){
return _.map(response.data, function(item){
return {
name: item.name,
description:item.description,
starts: item.startCount
}
})
})
}
myService.getUserEvents = function getUserEvents(){
...
}
myService.getAll = function(){
var userPromise = myService.getData(),
userEventsPromise = myService.getUserRepos(),
userReposPromise = myService.getUserRepos();
return $q.all([userPromise, userEventsPromise, userReposPromise]).then(function(){
....
})
}
})
Copier après la connexion

2.$http demande de cache

Le deuxième paramètre formel de la méthode get de $http accepte un objet. Le champ de cache de l'objet peut accepter un type booléen pour implémenter la mise en cache, c'est-à-dire {cache:true}, ou il peut également accepter un service.

Créez un service via la méthode d'usine et injectez le service dans le contrôleur.

angular.module('app',[])
.factory("myCache", function($cacheFactory){
return $cacheFactory("me");
})
.controller("AppCtrl", function($http, myCache){
var app = this;
app.load = function(){
$http.get("apiurl",{cache:myCache})
.success(function(data){
app.data = data;
})
}
app.clearCache = function(){
myCache.remove("apiurl");
}
})
Copier après la connexion

Résumé de l’éditeur :

● En fait, c'est $cacheFactory
qui implémente le mécanisme de mise en cache ● Placez le mécanisme de mise en cache dans la requête en cours via {cache:myCache}
● $cacheFactory utilise l'API de requête comme clé, donc lors de la suppression du cache, il efface également le cache en fonction de cette clé

Ce qui précède est la méthode de mise en cache $http et de traitement de plusieurs requêtes $http dans AngularJS partagée par l'éditeur. J'espère que cela sera utile à tout le monde.

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!