JSON Formatter
JSON Formatter is an AngularJS directive for rendering JSON objects in HTML with a collapsible navigation.
Now also available in pure JavaScript with zero dependency!
Usage
-
Install via Bower or npm
bower install json-formatter --save...or
npm install jsonformatter --save -
Add
jsonFormatter
to your app dependenciesangular -
Use
<json-formatter>
directive -
open
attribute accepts a number which indicates how many levels rendered JSON should be opened
Configuration
You can use JSONFormatterConfig
provider to configure JOSN Formatter.
Available configurations
Hover Preview
hoverPreviewEnabled
: enable preview on hoverhoverPreviewArrayCount
: number of array items to show in preview Any array larger than this number will be shown asArray[XXX]
whereXXX
is length of the array.hoverPreviewFieldCount
: number of object properties to show for object preview. Any object with more properties that thin number will be truncated.
Example using configuration
app;
Demo
See Examples here
Known Bugs
hashKey
If you are iterating in an array of objects using ng-repeat
, make sure you are using track by $index
to avoid adding extra $$hashKey
to your objects.
Browser Support
All modern browsers are supported. Lowest supported version of Internet Explorer is IE9.
License
Apache 2.0
See LICENSE