ngx-model2form

A RxJS operator to map a model entity to its equivalent Angular form entity.

Installing

npm install --save ngx-model2form

And import to your main application module

import 'ngx-model2form';

You are ready to use the RxJS custom operator.

Usage

Assuming this.people$ is a stream of people, represented by the model:

interface Person {
  name: string;
  height: number;
  hobbies: string[];
}

Chaining the operator with the stream:

this.peopleForm$ = this.people$.toNgForm();

results with a stream of FormGroup/FormArray/FormControl with a structure simillar to the originated Person model.

This stream can be passed through a component input to benefit of the component's change detector, and transform into the underlying form entity.

Validators

You can pass validator/s as-is (for primitives) or an object, reflecting the structure of your model.

Primitives:

this.people$.toNgForm(Validators.required);
this.people$.toNgForm([Validators.min(0), Validators.max(9)]);

Object:

this.people$.toNgForm({
  name: Validators.required,
  height: [Validators.min(0), Validators.max(9)]]
});

• Notice that the hobbies property is missing, and thus will be omitted from validation.

Array property

Array property can be passed a simple validator/s to validate every item in the list, or an object with index key/s to validate a single or specific items.

Validating the whole array with a validation set:

this.people$.toNgForm({
  hobbies: [Validators.min(0), Validators.max(9)]
});

Validating specific items:

this.people$.toNgForm({
  hobbies: {
    "0": [Validators.min(0), Validators.max(9)],
    "3": Validators.required
  }
});

Selector Function:

Validators can be passed through a selector function. The selector is given the current model as a parameter, and the returned value determines the validator/s for the form (returned as a primitive, array or an object).

this.people$.toNgForm((person: Person) => ({
  height: (person.height > 193) ? Validators.required : undefined
}));

Planned features

• Include model properties: Only transform properties that are mentioned in the include entity into form entities. Keep other properties as object properties.
• Exclude model properties: Omit transforming properties that are mentioned in the exclude entity into form entities. Keep transforming other properties into form entities.

Running the tests

No tests available at the moment. Working to get it done.

Versioning

We use SemVer for versioning. For the versions available, see the releases on this repository.

Authors

• Chen Eshchar - ChenOpinya

License

This project is licensed under the MIT License - see the LICENSE.md file for details