nxt-json-view

Angular JSON viewer

An interactive JSON view component for Angular.

Quick links

• Demo
• Getting started
• API docs

Installing

npm install --save nxt-json-view

Import JSON view module

import { JsonViewModule } from 'nxt-json-view'

@NgModule({
    ...
    imports: [
        ...
        JsonViewModule
    ]
})

Prepare JSON data

data = {
    "name": "nxt-json-view",
    "url": "https://github.com/Liquid-JS/nxt-components/tree/master/packages/json-view",
    "string": "github",
    "number": 88,
    "boolean": true,
    "object": {
        "obj1": "obj1",
        "obj2": "obj2",
        "object": {
            "obj11": "obj11",
            "obj22": "obj22"
        },
        "emptyArray": []
    },
    "array": [
        1,
        2,
        3
    ],
    "date": new Date(),
    "null": null
}

Use it in a template

<nxt-json-view [data]="data"></nxt-json-view>