Ngx-json-tree NPM

Json2Tree

This library is mainly created to easily visualize JSON data/string into Object tree. It was generated with Angular CLI version 12.0.5.

npm install ngx-json-tree

To save this in dependencies: npm install ngx-json-tree --save

In your parent module, Import Json2TreeModule

@NgModule({
  ...,
  imports: [
    ...,
    Json2TreeModule,
    ...
  ],
  ...
})
export class AppModule { }

In your component: <json2-tree [data]="data"></json2-tree>

To expand all nodes: <json2-tree [data]="data" [expandAllNodes]=true></json2-tree>

To expand only 2 levels: <json2-tree [data]="data" [expandLevel]=2></json2-tree>

An example for this project can be found at github-pages of this repository

Name	Type	Default	Description
data	any	null	JSON Object or string to display
expandAllNodes	boolean	false	Set this to `true` to expand all the nodes(If available)
expandLevel	number	-1	To expand nodes for given levels
separator	string	:	To change the separator
style	any	null	Inline style of the component

Name	Element
jtree-node	Node element
jnode-toggler	Toggle element
jnode-key	Node key element
jnode-separator	Separator element
jnode-value	Node value element
child-jnode	Children (or) Nested Node element