I have an angular resource declared in the following manner:
angular.module('xpto', ['ngResource'])
.factory('XPTO', function ($resource, $location) {
var XPTO = $resource($location.protocol() + '://' + $location.host() +
':port' + '/myservice.svc/gerencia?sigla=:sigla',
{
port: ':' + $location.port()
}
);
return XPTO;
})
and I need to make a call to the service with a parameter that includes an ampersand (&), like this:
XPTO.query({ sigla: 'abc&d' }, function (gerencias) {
$scope.gerenciasBuscadas = gerencias;
});
Unfortunately, AngularJS does not encode the & correctly. It sends "sigla=abc&d" instead of "sigla=abc%26d", causing my server to interpret the query string parameter value for "sigla" as just "abc" rather than "abc&d".
Upon examining angular-resource-1.0.7.js, I found the following:
/**
* We need our custom method because encodeURIComponent is too aggressive and doesn't follow
* http://www.ietf.org/rfc/rfc3986.txt with regards to the character set (pchar) allowed in path
* segments:
* segment = *pchar
* pchar = unreserved / pct-encoded / sub-delims / ":" / "@"
* pct-encoded = "%" HEXDIG HEXDIG
* unreserved = ALPHA / DIGIT / "-" / "." / "_" / "~"
* sub-delims = "!" / "$" / "&" / "'" / "(" / ")"
* / "*" / "+" / "," / ";"
*/
function encodeUriSegment(val) {
return encodeUriQuery(val, true).
replace(/%26/gi, '&').
replace(/%3D/gi, '=').
replace(/%2B/gi, '+');
}
Thus, it will encode '&' and then decode it before sending the request to the server. Is there a way for me to customize the URL right before it is sent to the server? Modifying encodeUriSegment is an option, but it could potentially cause issues with other parts of Angular. Any suggestions?