Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
84 lines (60 sloc) 2.91 KB

AngularJS $filter and $http convert JSON to snake or camelcase

Build Status Coverage Status Codacy Badge

A cleaner way to keep your standard JS objects in camelcase communicating to standardized snakecase APIs.

This angular module has no external dependencies, and can act automatically under $http "with defaults transFormRequest and transformResponse" or can be used as $filter('snake') or $filter('camel') anywhere in your view or controller.

Compatible with AngularJS 1.4.X

Live demo

http://embed.plnkr.co/p431U6/

Get It

The easiest way to install is using bower

bower install --save ng-snake-camel

Alternatively you can download from the GitHub project: https://github.com/Serrabits/ngSnakeCamel

Load It

Load the ng-snake-camel.js file into your web app after loading angular.js

<html>
  ...
  <head>
    ...
    <script src="angular.js"></script>
    <script src="bower_components/ngSnakeCamel/ng-snake-camel.js"></script>
    ...
  </head>
  ...
</html>

Use It

Make sure that your AngularJS application references the ngSnakeCamel module:

angular.module('myApp', ['ngSnakeCamel']);

$http

If you want to enable the transformation to all your requests $ http, set true in snakeCamelProvider.setHttpTransform(true) like this:

angular.module ('myApp' ['ngSnakeCamel'])
	.config(function(snakeCamelProvider) {
		snakeCamelProvider.setHttpTransform(true);
	});

To apply the transformation request by request, set the $http configs transformRequest and transformResponse as follows:

$http.post(http://example.com, {
	transformRequest: function(data) {
		return $filter('snake')(angular.toJson(data));
    },
    transformResponse: function(data) {
    	return $filter('camel')(angular.fromJson(data));
    }
})
.success()
.error();

Note: angular.toJson() and angular.fromJson() are needed for when the transformation is applied directly to request the default transformations are not performed. For questions of a look at the $http documentation

$filter

To use the snake and camel filters in your views, simply apply within the braces {{expression | snake}} or {{expression | camel}}. For questions of a look at the $filter documentation