Angular 2.0 - tutoriel 17 : requêtes AJAX et observables

Angular 2 a opté pour l'utilisation des observables plutôt que des habituelles promises dans le cadre des requêtes asynchrones. RxJS, excellente librairie dédiée à l'asynchrone, a été choisie par l'équipe d'Angular 2 plutôt que de réinventer la roue. C'est donc les richesse et puissance des observables (épaulés par leurs nombreux operators), qui sont désormais accessibles aux développeurs Angular 2.

Qu'est-ce qu'un observable ? Un flux de données en push. Dans le cas de requêtes AJAX, un flux de données de type Response accessible via la classe Http du module '@angular/http', permettant de disposer de ses methodes get(), post(), put(), delete() etc correspondant aux verbes habituels lorsqu'il est question d'HTTP. Dans le cas d'un GET sur une API RESTful, get() retourne un observable. L'opérateur map() de RxJS, très semblable à la méthode native map() de tout array JavaScript, permet de tansformer chaque item poussé par un Observable de type "Response" en tableau d'objets JavaScript et renvoie un Observable auquel le consommateur de l'observable peut souscrire grâce à la bien nommée méthode subscribe().

Ladite méthode subscribe prend jusqu'à trois callbacks : le premier entre en scène à l'arrivée de chaque nouvel item poussé par l'observable auquel on est abonné, le second callback gère les éventuelles erreurs envoyées par l'observable, le troisième et dernier callback réagit à la réception d'un événement'complete', qui informe les subscribers que leur observable vient d'envoyer son dernier item.