Questions tagged [angular-http]

AngularJS tag for $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP.

The $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP.

For unit testing applications that use $http service, see $httpBackend mock.

For a higher level of abstraction, please check out the $resource service.

The $http API is based on the deferred/promise APIs exposed by the $q service. While for simple usage patterns this doesn't matter much, for advanced usage it is important to familiarize yourself with these APIs and the guarantees they provide.

General usage

The $http service is a function which takes a single argument — a configuration object — that is used to generate an HTTP request and returns a promise with two $http specific methods: .then and .catch.

// Simple GET request example :
$http.get('/someUrl')
  .then(function(response) {
    var data = response.data;
    // this callback will be called asynchronously
    // when the response is available
}).catch(function(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});
// Simple POST request example (passing data) :
$http.post('/someUrl', {msg:'hello word!'})
  .then(function(response) {
    // this callback will be called asynchronously
    // when the response is available
}).catch(function(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});

Since the returned value of calling the $http function is a promise, you can also use the then method to register callbacks, and these callbacks will receive a single argument – an object representing the response. See the API signature and type info below for more details.

A response status code between 200 and 299 is considered a success status and will result in the success callback being called. Note that if the response is a redirect, XMLHttpRequest will transparently follow it, meaning that the error callback will not be called for such responses.

970 questions
8
votes
1 answer

Requesting Example for angular.js $http (or $resource) POST and transformRequest as a service

Using angular 1.1.5 and needing to pass urlencoded data to the backend. I've gotten this to work with solution from here: How can I post data as form data instead of a request payload? $http({ method: 'POST', url: url, headers:…
7
votes
2 answers

How to use Angular interceptor in XmlHttpRequest

I am using Angular 4. Also used the http interceptor for any http request. https://angular.io/api/common/http/HttpInterceptor But I am using one of the post request using xmlHttpRequest for some file upload event. headers are setting properly in…
vik
  • 105
  • 13
7
votes
3 answers

Pattern for dealing with mapping API objects to UI model objects

I am switching to use the new HttpClient in angular. The API am calling returns json data in one format. I want to take this data and transform it into a typescript model class suitable for the UI to work with. The way I did this before was by…
AJM
  • 32,054
  • 48
  • 155
  • 243
7
votes
2 answers

Where and how to use HttpResponse in angular2

HttpResponse class(in @angular/common/http) is a replace of class Response of @angular/http(which is deprecated). Looking at docs don't give much idea of how and where to use it! Moreover, I tried to replace my old angular code but since this class…
Ankur Shah
  • 801
  • 1
  • 12
  • 26
7
votes
2 answers

Caching Data From HttpClient in Angular 4

i have a problem in making my caching more simpler. I think there is a better way to do this. My problem is that i have to do this "caching" codes in every get() function which is results in longer codes. Anyone help on how to do this the best way?…
Joseph
  • 7,042
  • 23
  • 83
  • 181
7
votes
1 answer

Pass datetime from angular $http.get request to Web API 2 controller

I have a web API 2 controller: [HttpGet] [Route("api/MyRoute/{date:datetime}")] public IHttpActionResult Get(DateTime date) { return Ok(date); } And an angular $http get call: $http.get("/api/MyRoute/" + new Date()); This doesn't work, I get a…
Sun
  • 4,458
  • 14
  • 66
  • 108
7
votes
3 answers

$http service cache when the method is post

when I set the $http to cache requests, I still see duplicate requests (with the same url and same data) sent to the server from browser network, $http.post(url, data, {cache:true} ).success(function(response) { I have following questions: Is this…
sisimh
  • 1,287
  • 3
  • 20
  • 37
7
votes
1 answer

CORS Issue same controller, one method is ok, other one is not

Very strange error I'm experiencing. I have two methods in controller which are called by angular js http get event. First one works fine, second one is throwing CORS error, not sure how is that possible since both of them are in same…
Laziale
  • 7,965
  • 46
  • 146
  • 262
7
votes
4 answers

$http.get with null parameters are not hitting the Web API controller

I am trying to get to Web API GET controller using $http.get in angular application as follows : $http.get(BasePath + '/api/documentapi/GetDocuments/' , { params: { …
Sumesh Kuttan
  • 1,333
  • 1
  • 17
  • 40
7
votes
2 answers

AngularJS service storing $http results to prevent requerying --- is there a better way to do this?

The Setting: I want to have a service that multiple controllers can query for data pulled using $http. The initial solution was to use promises as suggested here. The Problem: Each time a controller queries the service, the service then returns an…
RVC
  • 420
  • 1
  • 4
  • 12
6
votes
3 answers

Angular 4 Http POST not working

I hope everyone is doing great. I've recently started working with angular 4.4, i've been trying to post data to my api server, but unfortunately it's not working. I've spent like 2 days on it but still no success. And have already tried 6-7 article…
6
votes
1 answer

Angular http returning status 0, but I expect 404

I'm making a request to a server that has the following routes: app.use('/401', (req, res) => res.status(401).end()); app.use('/403', (req, res) => res.status(403).end()); app.use('/404', (req, res) => res.status(404).end()); app.use('/500', (req,…
BrunoLM
  • 97,872
  • 84
  • 296
  • 452
6
votes
2 answers

How can I extend the $http service in angular?

Unfortunately, we're stuck running 1.2.26 (will upgrade to 1.2.28 when it's gemified). In the meantime, how can I patch (heh) $http so that the short-hand patch method is available? I'm pretty new to the whole service/factory/module thing. I've done…
Volte
  • 1,905
  • 18
  • 25
6
votes
2 answers

What is the difference between $http and $q?

a) What are the difference between $http and $q ? b) When should $q be implement over $http and vice versa ? c) When and best practice for implement $http and $q at the same time?
J Rod
  • 621
  • 1
  • 8
  • 14
6
votes
2 answers

$http POST response from service to controller

How to get the response from Service in below case?? Service: app.factory('ajaxService', function($http) { updateTodoDetail: function(postDetail){ $http({ method: "POST", headers: {'Content-Type':…
Jay
  • 3,353
  • 5
  • 25
  • 34