TypeScript icon, indicating that this package has built-in type declarations

4.0.1 • Public • Published

npm version Build Status

Domain Object Reactive Forms

Version 4 for Angular 5+.

I'm maintaining this library in my free time. But since my son was born in 2017, I have little to no free time :)

Model-driven forms within the model!


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.

Want to create a form for an object?

  1. Add some annotations to the object.

    export class Person {
            label: "Name", 
            type: "text",
            validator: Validators.required, 
            errorMessage: "Name is required",
            updateModelOnChange: true
        name: string;
            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.

    @DorfForm() // must be above the Component annotation!
        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;
  3. You are done! Really! Enjoy your Reactive Form.

Detailed tutorials


Generated API documentation


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)
  • Angular Material module
  • Form arrays
  • Methods for speeding up the creation of custom fields (even more)

List of the online examples


npm i dorf

DownloadsWeekly Downloads






Unpacked Size

360 kB

Total Files


Last publish


  • mat3e