Currently taking a first pass at Angular Forms with some colleagues and I’m noticing an interesting design pattern implemented by a coworker where the FormControl is being extended to allow for additional properties including flags like readonly, showcancel and a few other custom properties. The controls are then iterated over in the form template to then render each input. This is a big concerning to me as we are extending the base angular classes that could change with updates to the framework.

Here is an example of what I am talking about:

    export class FormGroupModel extends FormGroup {     readOnly: boolean;     showCancel: boolean;     controls: { [key: string]: FormControlModel | FormGroupModel };      get(controlName: string): FormControlModel {         return <FormControlModel> super.get(controlName);     } }  export class FormControlModel extends FormControl {     readOnly: boolean;     showCancel: boolean; } 

Is there anything else that we should keep in mind when using this strategy? I’m not not totally certain that these classes were meant to be extended…