diff --git a/goldens/public-api/forms/forms.md b/goldens/public-api/forms/forms.md index 31ba733c521632..9ca809878cb881 100644 --- a/goldens/public-api/forms/forms.md +++ b/goldens/public-api/forms/forms.md @@ -730,8 +730,7 @@ export type UntypedFormArray = FormArray; export const UntypedFormArray: UntypedFormArrayCtor; // @public -export class UntypedFormBuilder { - constructor(); +export class UntypedFormBuilder extends FormBuilder { // (undocumented) array(controlsConfig: any[], validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null): UntypedFormArray; // (undocumented) diff --git a/packages/forms/src/form_builder.ts b/packages/forms/src/form_builder.ts index 4ea49e0066c4bf..6f602b19c9e3a9 100644 --- a/packages/forms/src/form_builder.ts +++ b/packages/forms/src/form_builder.ts @@ -187,49 +187,43 @@ export class FormBuilder { * UntypedFormBuilder is the same as @see FormBuilder, but it provides untyped controls. */ @Injectable({providedIn: ReactiveFormsModule}) -export class UntypedFormBuilder { - private _typedBuilder: FormBuilder; - - constructor() { - this._typedBuilder = new FormBuilder(); - } - +export class UntypedFormBuilder extends FormBuilder { /** * @see FormBuilder#group */ - group( + override group( controlsConfig: {[key: string]: any}, options?: AbstractControlOptions|null, ): UntypedFormGroup; /** * @deprecated */ - group( + override group( controlsConfig: {[key: string]: any}, options: {[key: string]: any}, ): UntypedFormGroup; - group( + override group( controlsConfig: {[key: string]: any}, options: AbstractControlOptions|{[key: string]: any}|null = null): UntypedFormGroup { - return this._typedBuilder.group(controlsConfig, options); + return super.group(controlsConfig, options); } /** * @see FormBuilder#control */ - control( + override control( formState: any, validatorOrOpts?: ValidatorFn|ValidatorFn[]|FormControlOptions|null, asyncValidator?: AsyncValidatorFn|AsyncValidatorFn[]|null): UntypedFormControl { - return this._typedBuilder.control(formState, validatorOrOpts, asyncValidator); + return super.control(formState, validatorOrOpts, asyncValidator); } /** * @see FormBuilder#array */ - array( + override array( controlsConfig: any[], validatorOrOpts?: ValidatorFn|ValidatorFn[]|AbstractControlOptions|null, asyncValidator?: AsyncValidatorFn|AsyncValidatorFn[]|null): UntypedFormArray { - return this._typedBuilder.array(controlsConfig, validatorOrOpts, asyncValidator); + return super.array(controlsConfig, validatorOrOpts, asyncValidator); } } diff --git a/packages/forms/test/form_builder_spec.ts b/packages/forms/test/form_builder_spec.ts index f640667ebab46e..e64364e5412115 100644 --- a/packages/forms/test/form_builder_spec.ts +++ b/packages/forms/test/form_builder_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ import {fakeAsync, tick} from '@angular/core/testing'; -import {FormBuilder, Validators} from '@angular/forms'; +import {FormBuilder, UntypedFormBuilder, Validators} from '@angular/forms'; import {of} from 'rxjs'; (function() { @@ -276,4 +276,17 @@ describe('Form Builder', () => { }); }); }); + +describe('UntypedFormBuilder', () => { + let fb: FormBuilder = new FormBuilder(); + let ufb: UntypedFormBuilder = new UntypedFormBuilder(); + + function typedFn(fb: FormBuilder): void {} + function untypedFn(fb: UntypedFormBuilder): void {} + + it('can be provided where a FormBuilder is expected and vice versa', () => { + typedFn(ufb); + untypedFn(fb); + }); +}); })();