@covalent/json-formatter

td-json-formatter

td-json-formatter renders a javascript object in Json format the same way the chrome/firefox console would render it using console.log().

Hovering on nodes will bring out a preview tooltip of the first 5 objects/properties of the node.

The tree is collapsable/expandable so you can navigate through its nodes.

API Summary

Properties:

Setup

Import the [CovalentJsonFormatterModule] using the forRoot() method in your NgModule:

import { CovalentJsonFormatterModule } from '@covalent/json-formatter';
@NgModule({
  imports: [
    CovalentJsonFormatterModule.forRoot(),
    ...
  ],
  ...
})
export class MyModule {}

Usage

Simply add the component and pass the object to be formatted as a [data] input.

Example for HTML usage:

<td-json-formatter [data]="object" key="root" [levelsOpen]="1">
</td-json-formatter>