obtenir une erreur de rappel dans le code ci-dessous en tant que (Uncaught ReferenceError: updateData n'est pas défini). Pourriez-vous m'aider s'il vous plaît, je suis nouveau sur angularjs.
var student = angular.module("studentModule", []);
student.controller("StudentCtrl", ["$scope", "$http", function($scope, $http) {
$http({
method: "jsonp",
url: "http://abelski.com/courses/ajax/data.json?callback=updateData"
})
.success(function (data, status, headers, config) {
$scope.students = data;
})
.error(function (data, status, headers, config) {
});
}]);
liens de code codepen.io/anon/pen/bNOXgB
Réponses:
3 pour la réponse № 1Le nom du rappel doit être la chaîne JSON_CALLBACK (voir https://docs.angularjs.org/api/ng/service/$ http # jsonp)
l'URL droite est donc http://abelski.com/courses/ajax/data.json?callback=JSON_CALLBACK
JSON_CALLBACK est juste un espace réservé, qui est remplacé par une fonction de rappel angulaire unique pour chaque requête jsonp
1 pour la réponse № 2
La bonne façon
Tout d’abord, je suggérerais de ne pas utiliser jsonp àtout. Il est plus facile de gâcher et peut créer plus de problèmes de sécurité. Au lieu de cela, retournez JSON dans un bon vieux get. Il y a très peu de cas valables d'utilisation réelle de jsonp.
{
"name":"dave",
"id":123123,
"average":94
}
La manière JSONP
Si vous devez utiliser JSONP, votre code pose quelques problèmes.
Le principal est que votre API ne respecte pasle paramètre de rappel. Si un client spécifie un nom de rappel, le serveur doit utiliser ce nom pour le wrapper, il ne peut pas renvoyer son propre nom codé en dur. C'est la norme actuelle pour JSONP et Angular repose sur vous.
Si vous codez en dur le nom du rappel dans le backendalors vous êtes obligé de créer une fonction globale pour le rappel dans votre interface, ce que vous avez fait dans votre exemple jQuery. Vous ne voulez pas faire cela, c’est une très mauvaise pratique. Angular concerne le confinement et vous voulez que votre rappel soit exécuté par $ http.success (), et non par une méthode globale que vous devez ensuite forcer de nouveau dans Angular. couler.
Pour que cela fonctionne, vous devez changer le nom du rappel dans l'URL pour qu'il soit JSON_CALLBACK, comme l'a déjà indiqué milanlempera. Votre API aussi doit respecter le nom de rappel donné et répondre avecle JSON enveloppé avec ce nom de fonction. Notez que JSON_CALLBACK est un paramètre fictif qu'Angular remplace (pour garder trace de plusieurs requêtes). Vous ne pouvez donc pas simplement coder en dur JSON_CALLBACK dans votre backend, cela ne fonctionnera pas non plus. Vous devez vraiment rendre votre serveur conforme aux normes de JSONP en répondant par le nom de rappel donné, sinon vous ne pouvez pas utiliser Angulars jsonp correctement.
Si vous ne pouvez pas modifier l'API, votre propre solution consiste à créer une fonction globale appelée updateData, ce que je recommande vivement de ne pas utiliser.
Tour bonus
Il suffit d'écrire ceci lorsque vous êtes nouveau sur Angular. En règle générale, ne faites pas de requête http dans vos contrôleurs. Pour toute requête http que vous souhaitez créer, créez un service pour gérer ces appels d'API. Vous pouvez ensuite injecter ce service de la même manière que vous injectez $ http ou $ scope dans le contrôleur, ce qui facilite beaucoup la réutilisation du code puisque vous pouvez maintenant injecter la même API dans tout contrôleur qui en a besoin sans avoir à répéter le code, et il est généralement plus facile à tester.