Domain Object Reactive Forms for Angular and TypeScript
npm install dorf 
I'm maintaining this library in my free time. But since my son was born in 2017, I have little to no free time :)
Angular's _Reactive Forms_ (a.k.a. _Model-driven Forms_) are great. Then, the dynamic generation of such forms is the next evolution step (sometimes called _Dynamic Forms_). This library is about taking those things to yet another level by coupling forms with _Domain Objects_.
typescript
@DorfObject()
export class Person {
@DorfInput({
label: "Name",
type: "text",
validator: Validators.required,
errorMessage: "Name is required",
updateModelOnChange: true
})
name: string; @DorfInput({
label: "Surname",
type: "text",
validator: Validators.required,
errorMessage: "Surname is required",
updateModelOnChange: true
})
surname: string;
}
`2. Create a _Component_ form which implements
IDorfForm and uses some annotations. E.g. you should pass the above object as an annotated (@DorfObjectInput()) property.
`typescript
@DorfForm() // must be above the Component annotation!
@Component({
selector: "person-details"
// no template or templateUrl = default one from DORF (!)
})
export class PersonDetailComponent implements IDorfForm {
@DorfObjectInput() domainObject: Person; // has Angular's @Input() behavior as well (!) constructor(public config: DorfConfigService) { }
onDorfSubmit() {
let result = this["form"].value;
console.log(result);
}
}
`
3. You are done! Really! Enjoy your _Reactive Form_.Detailed tutorials
* QuickStart - part I
* QuickStart - part II
* [[wiki] QuickStart - full](https://github.com/mat3e/dorf/wiki/QuickStart)Documentation
Generated API documentationVision
The aim of this library is to speed up boring things like a creation of the ordinary forms and styling them. Library is not strictly connected with any CSS framework. You can just pass the classes as DorfConfigService parameters. Future plans include:
- More tests, a nice documentation and step by step tutorial on building with DORF
- UX improvements - aria support, styles prepared for most common libraries
- Reactive grids. It is another boring, ordinary thing (and
onSummary is already presented in the field definition`)