@ngspot/ng-superclass-material

ng-superclass-material

This package features class FormComponentMaterialSuperclass. Extend from this class to make it easy to write custom form controls compatible with Material Form Field.

Installation

NPM

npm install @ngspot/ng-superclass-material

Yarn

yarn add @ngspot/ng-superclass-material

Overview

Writing a custom control can be quite a bit work. Writing a custom control compatible with Material Form Field is even more work.

The work associated with writing a custom control is simplified via FormComponentSuperclass class from @ngspot/ng-superclass package. You are welcome.

@ngspot/ng-superclass-material package presents a layer on top of it. It features FormComponentMaterialSuperclass that extends from FormComponentSuperclass and makes it much easier to author form components compatible with Material Form Field.

Take a look at the exactly the same component built by hand vs when FormComponentMaterialSuperclass was used:

See the full code for this example in the Demo

Usage:

• Extend your component class from the FormComponentMaterialSuperclass
• Implement MatFormFieldControl
• Make sure to add MatFormFieldControl to providers
• The rest is the same as for the FormComponentSuperclass. See docs here.

@Component({
  // ...
  providers: [{ provide: MatFormFieldControl, useExisting: MyComponent }],
})
class MyComponent
  extends FormComponentMaterialSuperclass<ValueType>
  implements MatFormFieldControl<ValueType> {
  // ...
}

License

MIT © Dmitry Efimenko