Changing field / property names in JSON requests and respnses in Angular.js

Question

I currently have JSON like the following (from the Australia Post developer guide):

"PickupDetails_v1.Header": 
{ "Common_v1.UserName": "testuser", 
"Common_v1.AccessKey": "xxxxxxxxx", 
"Common_v1.CustomerID": 123 }

I'd like to know what the best approach is to being able to have an object in JS without the namespaces (e.g. PickupDetails_v1) when retrieving data from the API and vice versa when sending data. Basically I'd like to be able to know the best way to be able to customize JSON property names in Angular.

For example:

var pickupDetails = { UserName: "testuser"; AccessKey: "xxxxxxx" }; 
$http.post(pickupDetails, "http://www.example.com/postageDetails"); // Should send the pickup details with the namespaces).

var storedPickupDetails = $http.get("http://www.example.com/postageDetails"); // Should have the same properties as pickupDetails.

i'm not sure what are you asking for... can you give more clarification? — Liad Livnat, Jul 14 '14 at 07:27
Means you want only the content within "PickupDetails_v1.Header" — Nidhish Krishnan, Jul 14 '14 at 07:29
This might be helpful: http://stackoverflow.com/questions/4647817/javascript-object-rename-key — akn, Jul 14 '14 at 07:35
Basically I want the property names in JavaScript to be like this: var pickupDetails = { "PickupDetails": { "UserName": "testUser" }}, etc — ACOMIT001, Jul 14 '14 at 12:32

score 1 · Accepted Answer · answered Jul 14 '14 at 08:33

I would do this with interceptors.

The below example is taken from the documentation for $http and modified slightly for brevity.

$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
  return {
    // optional method
    'request': function(config) {
      // do something on success
      return config;
    },

    // optional method
    'response': function(response) {
      // do something on success
      return response;
    },
  };
});

$httpProvider.interceptors.push('myHttpInterceptor');

The config and response objects will contain all data about requests and responses and you could hook into the data property of those objects and change the keys to add/remove the namespace

Changing field / property names in JSON requests and respnses in Angular.js

1 Answers1