AngularJS - using jQuery parameter to format GET request string for GET file

I have a backend that understands query strings in jQuery $.param . For example, having an object such as

 { search: "Miller", name: ["Felipe", "Fernanda"] } 

It will request a URL with the following query string:

 http://theurl/path?search=Miller&name%5B%5D=Felipe&name%5B%5D=Fernanda 

It mainly uses name[]=Felipe&name[]=Fernada , but the URL is encoded.

The same object, when parsed by AngularJS, ends with this format:

 http://theurl/path?search=Miller&name=Felipe,Fernanda 

That my backend doesn't understand.

Reading this other question , I thought using transformRequest would help, however it is not. Here is my test code:

HTML

 <div ng-controller="UserCtrl"> <pre>{{ data | json}}</pre> </div> 

Javascript

 var myApp = angular.module('myApp',['ngResource']); var transformFn = function(data, headersGetter) { console.debug('transformRequest', data); if (!data) return; console.debug('data in', data); var dataOut = $.param(data); console.debug('data out', dataOut); return dataOut; }; myApp.config(['$httpProvider', function($httpProvider) { $httpProvider.defaults.transformRequest.push(transformFn); }]); myApp.factory('User', ['$resource', function($resource) { return $resource('/echo/:type/', {type:'json'}, { query: { method: 'GET' } }); }]); myApp.controller('UserCtrl', ['$scope', 'User', function($scope, User) { User.query({ seach: 'Miller', name: ['Felipe', 'Fernanda']}, function(data) { console.debug('data', data); $scope.data = data; }); }]); 

However, when you try to run this code, you will notice that the data attribute on transformFn always undefined, and the query string remains in AngularJS format.

You can also see this in jsFiddle: http://jsfiddle.net/fcoury/QKmnX/

Any idea how to get the query string to use jQuery $ .param format?

EDIT : I was checking AngularJS code for branch v1.0.x, and I could not find a way to change the query string building code that takes place here:

https://github.com/angular/angular.js/blob/v1.0.x/src/ngResource/resource.js#L299-L306

Is there any reasonable way for anyone to override this part of the ngResource class?

+4
source share
2 answers

My simple solution:

 module.run(['$http', '$httpParamSerializerJQLike', function($http, $httpParamSerializerJQLike) { $http.defaults.paramSerializer = $httpParamSerializerJQLike; }]); 
+1
source

Why are you using push? The examples from here are simply assigned:

 $httpProvider.defaults.transformRequest = function(data) {...}; 
0
source

All Articles