Form Factory
Generate Angular Forms for you !
Get started
npm install ng-form-factory
In your app.module.ts
@NgModule({
imports: [
FormFactoryModule.forRoot()
]
})
In app.component.ts
const schema = {
form: 'control',
load: () => import('./text.component').then(c => c.TextFormComponent),
};
@Component({
selector: 'app-root',
template: '<form-outlet [form]="form" [schema]="schema"/>',
})
export class AppComponent implements FormOutlet {
form = createForms(schema, 'some text');
schema: FormSchema;
}
The schema is going to lazy load the component TextFormComponent
and pass it the form.
Let's create the component in text.component.ts
:
import { Component } from '@angular/core';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { FormOutlet, FormSchema } from 'ng-form-factory';
@Component({
selector: 'form-text',
template: '<input [formControl]="form" />',
})
export class TextFormComponent implements FormOutlet {
form: FormControl;
schema: FormSchema;
}
@Ngodule({
declarations: [TextFormComponent],
import: [ReactiveFormsModule]
})
export class TextFormModule {}
FormOutlet make sure that the component implements a form & a schema
Serve the app, you should see the form-text beeing lazy loaded automatically.