Popularni postovi

Saturday, 5 July 2014

$http request with custom params

Here is tutorial: http://pointblankdevelopment.com.au/blog/angularjs-aspnet-web-api-2-server-side-sorting-searching-and-paging

Suppose we wanted to fetch a user’s information from our server. If the API is available
at /api/user, and accepts the id as a URL parameter, then our XHR request using Angular’s
core $http service would look something like the following:


$http.get('api/user', {params: {id: '5'}

}).success(function(data, status, headers, config) {

// Do something successful.

}).error(function(data, status, headers, config) {

// Handle the error

});



If you are from the jQuery world, you should notice how similarly AngularJS and jQuery
interact with asynchronous requests.
The $http.get method we used in the preceding example is just one of the many convenience
methods that the core $http AngularJS service provides. Similarly, if you
wanted to make a POST request using AngularJS with the same URL parameters and
some POST data, you would do so as follows:


var postData = {text: 'long blob of text'};

// The next line gets appended to the URL as params

// so it would become a post request to /api/user?id=5

var config = {params: {id: '5'}};

$http.post('api/user', postData, config

).success(function(data, status, headers, config) {

// Do something successful

}).error(function(data, status, headers, config) {

// Handle the error

});




Configuring Your Request Further
At times, the standard request options provided out of the box are not enough. This
could be because you want to:
• Add some authorization headers for your request
• Change how caching is handled for the request
• Transform the request going out, or the response coming in, in certain set ways
In such cases, you can configure your request further through the optional configuration
object passed to the requests. In the prior example, we used the config object to specify
optional URL parameters. But even the GET and POST methods we showed there are
convenience methods. The barebones method call would look something like:
$http(config)

What follows is a basic pseudo-code template for calling this method:

$http({
method: string,
url: string,
params: object,
data: string or object,
headers: object,
transformRequest: function transform(data, headersGetter) or
an array of functions,
transformResponse: function transform(data, headersGetter) or
an array of functions,
cache: boolean or Cache object,
timeout: number,
withCredentials: boolean
});

Communicating Over $http | 103
The GET, POST, and other convenience methods set the method, so you don’t need to.
The config object gets passed in as the last argument to $http.get, $http.post, so you
can still use it while using any of the convenience methods.
You can change the request being made by passing the config object set with the following
keys:
method
A string representing the HTTP request type, like GET, or POST
url
A URL string representing the absolute or relative URL of the resource being requested
params
An object (a map to be precise) of string-to strings, representing keys and values
that will be translated to URL parameters. For example:
[{key1: 'value1', key2: 'value2'}]
would be converted to:
?key1=value1&key2=value2
after the URL. If we use an object, instead of a string or a number, for the value, the
object will be converted to a JSON string.
data
A string or an object that will be sent as the request message data
timeout
The time in milliseconds to wait before the request is treated as timed out
There are a few more options that can be configured, which we will explore in more
depth in the following sections.

No comments:

Post a Comment