AngularJS AJAX

AngularJS provides a $http service for reading data and remote servers. It is used to retrieve the desired records from a server.

AngularJS requires data in JSON format. Once the data is ready, $http gets the data form server in the following manner:

Here the file "data.txt" is employee's records. $http service makes an AJAX call and sets response to its property employees. This model is used to draw tables in HTML.

AngularJS AJAX Example

testAngularJS.htm

Here the file data.txt contains the employee's record.

"data.txt" (employee's data in JSON format)

To execute the above example, you have to deploy testAngularJS.htm and data.txt file to a web server.

Open the file testAngularJS.htm using the URL of your server in a web browser and see the result.

Output:

The result would look like this:

Table:

HTTP Service Methods

There are several shortcut methods of calling the $http service. In the above example, .get method of the $http service is used. Following are several other shortcut methods:

• .delete()
• .get()
• .head()
• .jsonp()
• .patch()
• .post()
• .put()

Properties

The response from the server is an object with these properties:

• .config the object used to generate the request.
• .data a string, or an object, carrying the response from the server.
• .headers a function to use to get header information.
• .status a number defining the HTTP status.
• .statusText a string defining the HTTP status.