Skip to content

jscharett/ngx-json-schema-form

Repository files navigation

License: MIT npm version npm downloads Build Status codecov Dependencies devDependencies Contributor Covenant

NgxJsonSchemaForm

A JSON Schema Form builder for Angular 7+, similar to

Note: This project attemtps to take over where its predecesor left off. It's based off of the above project, but rewritten from the ground up.

Note: This project is not ready for consumption. There is still a lot to do to bring parity with Angular JSON Schema Form

Check out the live demo and play with the examples

Check out some examples here.

Using Angular JSON Schema Form

Basic use

Begin by installing the library in your project

npm install ngx-json-schema-form --save

Then import JsonSchemaFormModule in your main application module:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { JsonSchemaFormModule } from 'ngx-json-schema-form';

import { AppComponent } from './app.component';

@NgModule({
    declarations: [ AppComponent ],
    imports: [
        BrowserModule,
        JsonSchemaFormModule.forRoot()
    ],
    bootstrap: [ AppComponent ]
})
export class AppModule { }

To display a form in your Angular component, simply add the following to your component's template:

<json-schema-form
    [schema]="schema"
></json-schema-form>

Where schema is a valid JSON schema object. If you don't already have your own schemas, you can find a bunch of samples to test with in the projects/demo/src/assets/examples folder.