angularJS $http: Example of interaction with server

A very critical service is used when interacting with a remote HTTP server in angularJS - $http.

$http is a core service in angular, using the browser's xmlhttprequest or via JSONP object to interact with the remote HTTP server.
The usage method of $http is the same as the $.ajax operation provided by jquery, and both support multiple method requests, get, post, put, delete, etc.
$http's various ways of requesting are closer to rest style.
In the controller, you can get the $http object in the same way as $scope. function controller($scope,$http){}

The following instructions for using the $http service are as follows:

Copy the codeThe code is as follows:

$http(config).success(function(data,status,headers,config){}).error(function(data,status,headers,config){});

It is a JSON object, which mainly contains the requested url, data, method, etc., such as {url:"", method:"post", data:{name:"12346",pwd:"123"}}.

method {String} Request method. "GET"."POST"
url {String} The URL address of the request
params {key,value} Request parameters, will be spliced on the URL? key=value
data {key,value} data will be put into the request and sent to the server
cache {boolean} If true, the default $http cache is used when requesting http GET, otherwise an instance of $cacheFactory is used
timeout {number} Set timeout

2. Success is the callback function after the request is successful, and error is the callback function after the request is failed. Here we mainly explain the four parameters returned.

data response body
status corresponding status value
headers function to get the getter
config object in the config request, same as point 1 above

In order to facilitate everyone to interact with the HTTP server, angularJS provides various request methods.

$/post(url,data,config) url and name are required, config can be optional

$/delete/jsonp/head(url,confid) url requires, config is optional

The parameters of url, data, config and $http are the same,

Here is a simple demo to show how to use $http() and $().

<!DOCTYPE HTML>
<html lang="zh-cn" >
<head>
  <meta charset="UTF-8">
  <title>CSSClasses</title>
  <script src="" type="text/javascript"></script>
<script type="text/javascript">
  function ctrl($http,$scope){
    $ = function(user){
      $("",user).success(function(data, status, headers, config){
        alert("success");
      }).error(function(data, status, headers, config){
        alert("error");
      })
    }
    $scope.login1 = function(user){
      $http({url:"",data:user}).success(function(data, status, headers, config){
        alert("success");
      }).error(function(data, status, headers, config){
        alert("error");
      })
    }
  }
</script>
</head>
<body ng-app>
  <div ng-controller="ctrl">
    <form name="loginFm">
      Name:<input ng-model="" />
      pwd: <input ng-model="" />
      <input type="button" value="login" ng-click="login(user)" />
      <input type="button" value="login1" ng-click="login1(user)" />
    </form>
  </div>

</body>
</html>

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.