angular.js $http equivalent of jquery's ajax traditional param

Question

as described here: What is "traditional style of param serialization' in JQuery and here: passing array from javascript to controller MVC 4

jQuery ajax function has the option of changing how objects are serialized before being sent to server using traditional = true. This is useful for sending an array of objects to the server.

Is there a similar option in angular's $http directive?

Thanks Bixi and blint for the responses. in the end, I simply used JSON.stringify and sent string to server, then deserialized it server side, as described in passing array from javascript to controller MVC 4 — CodeToad, Apr 03 '14 at 11:13

ngasull · Answer 1 · 2014-04-02T10:39:47.667

This is a built-il feature in $http service.

Indeed, as described in doc,

$http({method: 'GET', url: '/someUrl', params: someMap})

will make an "ajax" call serializing someMap following this parameter rule:

{Object.string|Object} – Map of strings or objects which will be turned to ?key1=value1&key2=value2 after the url. If the value is not a string, it will be JSONified.

Edit: to answer your question

Is there a similar option in angular's $http utility?

No. You should handle conversion manually, on demand if necessary (you may use jQuery's API). Bixi's answer is very interesting if you want to change the global behaviour, but it seems you need on-demand specific parameter serialization.

score 3 · Answer 2 · answered Apr 02 '14 at 09:59

3

Yes you can handle this in angular.

In your config block of your module, you can just add :

$httpProvider.defaults.transformRequest = function(data) {
    if (data === undefined) {
        return data;
    }
    return $.param(data);
};

To transform params request more "url like"

See $http angularjs documentation

answered Apr 02 '14 at 09:59

Jscti

14,096
4
62
87

This is an interesting solution. But be careful using this piece of code. `$httpProvider.defaults.transformRequest` is an Array, a chain of transform functions. You should be aware that resetting it implies existing transformation chain's replacement. – ngasull Apr 02 '14 at 10:44
3

I would assume that author is asking for 'angular-native' way without jquery-dependency – 2ooom Aug 25 '14 at 15:09

score 2 · Answer 3 · answered Jul 08 '14 at 07:18

2

Bixi's code was pretty much close.

Here is how I did it:

$httpProvider.defaults.transformRequest = function(data) {
    if (data === undefined) {
        return data;
    }
    return $.param(data, true); // SOS : set `traditional` arg to true for array serialization to be compatible with ASP MVC model binder.
};

Check out the docs for $.param() : http://api.jquery.com/jquery.param/

This will help with array serialization.

answered Jul 08 '14 at 07:18

user2173353

4,316
4
47
79

3

IMHO this is really not super cool as it relies on jQuery to work. We are many who are looking to ditch jquery altogether – Spock Jul 10 '14 at 22:04
Yes, but I would prefer if we ditched all HTML/JS specs together with it. They are full of hacks, lack of logic and ugly "patches". Having moved from desktop development to web development, I see web development being directly linked to hacking stuff, re-inventing the wheel, fixing broken stuff, etc that are not flattering at all to the people promoting those specs... If those specs don't change, I am not sure how much abstraction from the ugly stuff Angular (which is great by the way) can provide. Anyway, perhaps I'm biased or sth. The above is the only solution I came up with, unfortunately. – user2173353 Jul 11 '14 at 07:34
Sorry to see the downvotes. I think this answer contributes something of value. angular depends on jQlite, so it relies on jQuery to work regardless. the proposed solution is not breaking the MV* design pattern of angular, so its does not seem like such a bad trade-off. – CodeToad Dec 04 '14 at 16:33

angular.js $http equivalent of jquery's ajax traditional param

3 Answers3