Currently, I am in the process of updating some older forms to include stronger typing in order to address eslint errors. One recurring issue I have encountered is when using the .value operator on abstract controls, it causes an error in my IDE stating "Unsafe member access .value on an any value," which goes against the guidelines set in my project's no-unsafe-member-access rule. Here is an example:
// Defining strong typing from the beginning
interface sampleForm {
account_1: FormControl<string>;
account_2: FormControl<string>;
};
// Building the form
this.myForm: sampleForm = this.formBuilder.group({
account_1: new FormControl<string|null>("placeholder", [Validators.maxLength(128),]),
accounte_2: new FormControl<string|null>("", [Validators.maxLength(128),]),
});
// The issue arises here with "Unsafe assignment of an `any` value" and "Unsafe member access .value on an `any` value."
const t = this.myForm.controls[`account_${1}].value;
I have experimented with various solutions such as using
controls.controlName.getRawValue()controls.get(controlName), controls.controlName.value as stringlet t = controls.controlName as AbstractControl; t = t.value as string;