AngularJS GET ajax call with Array parameters

Question

I have already seen the following SO questions Send an array through a GET request using the AngularJS $ http service and Skip the array data from Angular $ http POST . But the proposed solutions there do not seem to work for me. My task is array objects.

I have the following ajax call from AngularJS with array parameters

return $http({ method: 'GET', url: '/api/PatientCategoryApi/PatCat', params: { "numbers[]": [{ First: 999, Second: 888 }]}, headers: { 'Content-Type': 'application/Json' } }) 

The url generated by this call does not work for me. I tried various avatars of the parameters, and url generated (received them with the help of a violinist) is as follows.

 params: { numbers: JSON.stringify([{ First: 999, Second: 888 }]) }, http://localhost:50849/api/PatientCategoryApi/PatCat?numbers=%5B%7B%22First%22:999,%22Second%22:888%7D%5D params: { "numbers[]": JSON.stringify([{ First: 999, Second: 888 }]) }, http://localhost:50849/api/PatientCategoryApi/PatCat?numbers%5B%5D=%5B%7B%22First%22:999,%22Second%22:888%7D%5D params: { "numbers[]": [{ First: 999, Second: 888 }]}, http://localhost:50849/api/PatientCategoryApi/PatCat?numbers%5B%5D=%7B%22First%22:999,%22Second%22:888%7D params: { numbers: [{ First: 999, Second: 888 }]}, http://localhost:50849/api/PatientCategoryApi/PatCat?numbers%5B%5D=%7B%22First%22:999,%22Second%22:888%7D 

I want the url to be http: // localhost: 50849 / api / PatientCategoryApi / PatCat? Numbers [0] [first] = 999 & numbers [0] [second] = 888 . Because this is the only way my ASP.NET ASP.NET server code is able to understand and decrypt an array.

One way is to set the URL itself to fully save the parameters as follows. Works. This is the last option for me.

 return $http({ method: 'GET', url: '/api/PatientCategoryApi/PatCat?numbers[0][first]=999&numbers[0][second]=888&numbers[1][first]=9999&numbers[1][second]=8888', //params: {...}, remove this completely headers: { 'Content-Type': 'application/Json' } }) 

But I want to understand how to do this using params, so AngularJS will do it for me.

Answer 1

Do you want httpParamSerializerJQLike ! Use it like this:

 $http({ ... params: { "numbers": [{ First: 999, Second: 888 }]}, paramSerializer: '$httpParamSerializerJQLike', ... }); 

Or you can configure it by default for all calls to $http in the configuration block, for example:

 angular.module('yourModuleName').config(function($httpProvider) { $httpProvider.defaults.paramSerializer = '$httpParamSerializerJQLike'; });