web-dev-qa-db-fra.com

AngularJS synchronisant automatiquement les données entre le serveur et le client

Il y a quelque chose dans les documents AngularJS que je n'arrive pas à trouver ou peut-être que je manque juste.

Je crée une application web avec NodeJS et Express dans le back-end et j'essaie de comprendre comment elle peut interagir avec Angular dans le front-end. En particulier, j'aurai une API JSON pour Angular pour récupérer les informations. Je veux que le front-end soit toujours à jour.

Mes questions sont:

  • Est-ce que la fonction de liaison de données bidirectionnelle signifie Angular ($ resource ou $ http) récupère automatiquement les données du serveur toutes les n secondes)?
  • Utilise-t-il naturellement des sondages longs, courts ou websockets?
  • Avez-vous besoin de JQuery pour réaliser la synchronisation serveur-client ou tout peut être fait avec Angular?
  • Devez-vous ajouter du code supplémentaire pour que ce comportement se produise? Dois-je utiliser $ timeout?

Chaque exemple que je semble trouver implique que le client récupère les données une fois. Pas de synchronisation des données avec le serveur.

58
vilijou

La liaison bidirectionnelle dans AngularJS fait référence au modèle de données ($ scope) et à votre vue (directives). Par exemple, si les données changent dans votre modèle, la vue sera automatiquement mise à jour. De même, si l'utilisateur modifie les données dans la vue, votre modèle se mettra automatiquement à jour.

L'interaction avec les services Web s'effectue via le module de service $ http. Donc, pour obtenir des données de votre API RESTful, vous feriez quelque chose comme:

$http.get('/someUrl').success(successCallback);

La documentation complète pour $ http est sur le site AngularJS . Je pense que vous trouverez qu'il est très similaire aux méthodes $ .ajax de jQuery. Vous configurez facilement $ http.get () pour un sondage court avec le service $ timeout angular (essentiellement un wrapper pour setTimeout).

Pour les mises à jour en temps réel entre le client AngularJS et l'API du serveur, vous voudrez peut-être examiner Socket.io . Il utilise node.js pour créer une connexion socket en direct entre le navigateur et le serveur, et dispose de mécanismes de secours (flash, longue interrogation) pour les navigateurs plus anciens. Il y a un projet standard sur GitHub qui montre comment configurer AngularJS avec Socket.io: https://github.com/btford/angular-socket-io-seed

Récapituler:

La fonction de liaison de données bidirectionnelle signifie-t-elle que Angular ($ resource ou $ http) récupère automatiquement les données du serveur toutes les n secondes?

Non, la liaison bidirectionnelle se situe entre Angular modèles et vues.

Utilise-t-il naturellement des sondages longs, courts ou websockets?

Angular n'en inclut aucun par défaut. Vous devez les configurer vous-même.

Avez-vous besoin de JQuery pour réaliser la synchronisation serveur-client ou tout peut être fait avec Angular?

$ http est, au sens large, l'équivalent Angular du $ .ajax de jQuery

Devez-vous ajouter du code supplémentaire pour que ce comportement se produise? Dois-je utiliser $ timeout?

Utilisez $ timeout pour les interrogations courtes ou lancez votre propre solution pour les interrogations longues et/ou les websockets (voir le projet angular-socket-io-seed ).

81
eterps