How To Call API In AngularJS

In this article, we will learn about how we can call API in AngularJS.

API stands for Application Programming Interface. $http is an AngularJS service and can be used to read data from remote servers.

AngularJS $http

The $http service makes a request to the server and returns a response.

For calling the $http service there are several shortcut methods:

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


Open the Example1.html file and add the code in it.

<!DOCTYPE html>
    <script src=""></script>
    <div ng-app="myApp" ng-controller="myCtrl">
        <h1>API Response:</h1>
        <p>Status: {{status}}</p>
        <table border="1" width="100%">
                <th>First Name</th>
                <th>Last Name</th>
            <tr ng-repeat="x in data">
                <td align="center"><img src="{{x.avatar}}" height="50px" /></td>
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function ($scope, $http) {
                method: "GET",
                url: ""
            }).then(function Success(response) {
                $ =;
                $scope.status = "Success";
            }, function Error(response) {
                $scope.status = response.statusText;

That’s it.


Submit a Comment

Your email address will not be published. Required fields are marked *


Select Categories