Curriculum
Course: AngularJS
Login

Curriculum

AngularJS

AngularJS Tutorial

0/65
Text lesson

AngularJS Http

AngularJS $http

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

Example

Send a basic request to the server and display the result in a header.

<div ng-app=”myApp” ng-controller=”myCtrl”>

<p>Today’s welcome message is:</p>
<h1>{{myWelcome}}</h1>

</div>

<script>

var app = angular.module(‘myApp’, []);
app.controller(‘myCtrl’, function($scope, $http) {
  $http.get(“welcome.htm”)
  .then(function(response) {
    $scope.myWelcome = response.data;
  });
});
</script>

Methods

The example above utilizes the .get method from the $http service.

The .get method is one of several shortcut methods provided by the $http service. Other shortcut methods include:

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

The methods listed above are all shorthand ways of using the $http service.

Example

var app = angular.module(‘myApp’, []);
app.controller(‘myCtrl’, function($scope, $http) {
  $http({
    method : “GET”,
      url : “welcome.htm”
  }).then(function mySuccess(response) {
    $scope.myWelcome = response.data;
  }, function myError(response) {
    $scope.myWelcome = response.statusText;
  });
});

The example above calls the $http service with an object as an argument, which defines the HTTP method, the URL, and the actions to take on success or failure.

 

 

Previous
Next