Angular transformReq/Res

Globally & locally

by taly2808

HTML

<script src="https://code.angularjs.org/1.3.1/angular.js"></script>
<div ng-app="app" ng-controller="mainCtrl">
    <button ng-click="click()">Click</button>
</div>

JavaScript

angular.module("app", [])
// default transformation, globally
.config(function ($httpProvider) {
    $httpProvider.defaults.transformRequest.push(function (data, headerGetter) {
        console.log("transform Request");
        return data;
    });
    $httpProvider.defaults.transformResponse.push(function (data, headerGetter) {
        console.log("transform Response");
        return data;
    });
})
    .controller("mainCtrl", function ($scope, $http) {
    var json = {
        name: "angular",
        rate: "5"
    };
    $scope.click = function () {
        $http.post("/echo/json/", "json=" + encodeURIComponent(angular.toJson(json)), {
            //Use x-www-form-urlencoded Content-Type
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
            },
            //Override $http service's default transformRequest
            transformResponse: function (data, headerGetter) {
                console.log('call transform response');
                return data;
            }
        }).success(function (res) {
            console.log(res);
        });
    };
});