AngularJS Ajax using $http

In the previous post Ajax using AngularJS, we saw on what Ajax is and its need in modern web development tools, in this post we shall see on Ajax is supported in AngularJS using the $http service.

$http is an important service in AngularJS which helps in making Ajax calls to the server, $http takes the service URL to be invoked as a parameter, makes calls to the server gets the response and service and passes it back to Angular

The syntax for making Ajax calls using $http is as follows

$http.get('serviceURL').
  success(function(data, status, headers, config) {
          // Process response for Success here
  }).
  error(function(data, status, headers, config) {
          // Process response for Failure here
  });

The $http Ajax calls supports methods success() and error() to handle the response from the server end, the method names are self-descriptive they are used to handle success and error scenarios from the Ajax calls.

$http supports Get, Post, Put and Delete operations, all these take the service URL as parameters, the Post and Put variant in addition takes the Post data which is to be submitted to the service.

The $http service communicates with the server using XMLHttpRequest, due to this Ajax calls made using $http should be within the same domain, i.e both the client application and the service should be hosted in the same domain, calls made to a service/API in a different domain will fail.