Very Simple AngularJS $http POST Results in '400 (Bad Request)' and 'Invalid HTTP status code 400'

I think this post would be helpful.

How do I POST urlencoded form data with $http in AngularJS?

By default, the $http service will transform the outgoing request by serializing the data as JSON and then posting it with the content- type, "application/json". When we want to post the value as a FORM post, we need to change the serialization algorithm and post the data with the content-type, "application/x-www-form-urlencoded".

This is the modified plnkr from yours. Your code is missing conversion of JSON to encoded url.

http://plnkr.co/edit/4aeEDz73qgHSfOv1sBgn?p=preview

$http({    method: 'POST',    url: 'http://simpleApiEarl.azurewebsites.net/api/envelopes',    data: env,    headers: {'Content-Type': 'application/x-www-form-urlencoded'},    transformRequest: function(obj) {      var str = [];      for(var p in obj)      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));      return str.join("&");    }  }).

I found a blog post that corrected my issue:

http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/

Thanks to everyone for helping me out!

With AngularJS you can do in an easier way.

You can inject $httpParamSerializer and then prepare your data through $httpParamSerializer(data).

So your call should look something like:

$http({    method: 'POST',    url: 'http://simpleApiEarl.azurewebsites.net/api/envelopes',    data: $httpParamSerializer(env),    headers: {'Content-Type': 'application/x-www-form-urlencoded'}  })