Download presentation
Presentation is loading. Please wait.
1
AngularJS AJAX
2
$http.get(url, config) $http.post(url, data, config)
AngularJS AJAX $http Functions: $http.get(url, config) $http.post(url, data, config) $http.put(url, data, config) $http.delete(url, config) $http.head(url, config) $http.jsonp(url, config) var promise = $http(config); config parameters: method - GET, POST, PUT, DELETE or HEAD url params headers -additional HTTP headers timeout cache - enable XHR GET request caching transformRequest - set a function which can transform the request object before it is sent to the server transformResponse - transform the response sent back from the server
3
var promise = $http(config);
AngularJS AJAX var promise = $http(config); promise.success() and promise.error(): Inside the success() and error() function you should set the appropriate values on the $scope object data - The data parameter is the JSON status - HTTP status code returned by the server headers - function that can be used to obtain any HTTP response headers returned along with the response config - the configuration object that was used to generate the request
4
AngularJS AJAX example
<body ng-app="myapp"> <div ng-controller="MyController" > <button ng-click="myData.doClick(item, $event)"> Send AJAX Request </button> <br/> Data from server: {{myData.fromServer}} </div> </body>
5
AngularJS AJAX example
angular.module("myapp", []) .controller("MyController", function($scope, $http) { $scope.myData = {}; $scope.myData.doClick = function(item, event) { var responsePromise = $http.get( "/angularjs-examples/json-test-data.jsp"); responsePromise.success( function(data, status, headers, config) { $scope.myData.fromServer = data.title; }); responsePromise.error( alert("AJAX failed!"); } } );
Similar presentations
