In my Angular reactive form, I have an email field that I want to disable when the form is in edit mode instead of add mode. The code I am using for this is:
disabled: typeof user.user_id === 'string'
When I debug the modelToForm
method and check the value of typeof user.user_id === 'string
, it returns true which should work according to the logic. However, the field remains enabled even though it should be disabled based on this condition. Interestingly, if I manually set it to 'disabled: true'
, then the field is correctly disabled. Has anyone encountered a similar issue before?
public modelToForm(user: UserModel): FormGroup {
return this.fb.group({
firstName: [user.first_name, [
Validators.required,
Validators.maxLength(UserFormHelper.maxLengthName),
UserFormHelper.validateWhitespace
]],
email: [{value: user.email, disabled: typeof user.user_id === 'string'}, [
Validators.required,
Validators.maxLength(UserFormHelper.maxLengthEmail),
Validators.pattern(UserFormHelper.emailPattern)
]],
});
}