AngularJS JSON Filter with Example

Here we will learn what is json filter in angularjs and how to use json filter in angularjs applications with example. 

AngularJS JSON Filter

In angularjs, json filter is used to convert javascript object to json string. Generally it will be helpful while debugging the code. 

Syntax of AngularJS JSON Filter

Following is the syntax of using json filter in angularjs applications.

 

{{ jsonexpression | json : spacing }}

We will see how to use json filter in angularjs with simple example.

AngularJS JSON Filter Example

Following is the example of json filter in angularjs to convert javascript object to json string.

 

Live Preview

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>

AngularJs JSON Filter to Convert JavaScript Object to JSON String

</title>

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

</head>

<body ng-app="">

<div>

Default JSON Format

<pre>{{ {'name': 'Suresh Dasari','age': '29'} | json }}</pre>

JSON Format with Spacing

<pre>{{ {'name': 'Suresh Dasari','age': '29'} | json:10 }}</pre>

</div>

</body>

</html>

If you observe above code we declared two conditions with json filter one is without spaces and another one is with spaces. Now we will run and see the output of example.

Output of AngularJS JSON Filter Example

Following is the result of json filter example in angularjs application.

 

Angularjs json filter example output or result