5

Currently I'm using Angular 15 and in Angular 14 for the disabled input field in reactive form I used [attr.disabled]="disableField ? true : null".

This attribute after I update the Angular version 14 to 15 it's not working

Audwin Oyong
  • 2,247
  • 3
  • 15
  • 32
Joya
  • 51
  • 3
  • 1
    I tried [disabled]="condition" attribute but its not working I found another solution is formControlName.disable() but I want to put condition in html code – Joya Apr 18 '23 at 05:52
  • use a directive to "disabled", see e.g. [SO](https://stackoverflow.com/questions/47937639/how-to-make-a-disabled-reactive-form-editable-in-angular2/47938138#47938138) – Eliseo Apr 18 '23 at 06:07

1 Answers1

6

It's a change in Angular 15 that changes the disabled state.

This behavior change was caused by a fix to make setDisabledState always called. Previously, using [attr.disabled] caused your view to be out of sync with your model.

If you are using Reactive Forms? Try setting disabled on your model, not your template. Try new FormControl({ value: 'foo', disabled: true }). Or call myControl.disable() in ngOnInit. If you want to opt-out of the fix. Make sure you're on 15.1.0 or later and import FormsModule.withConfig({ callSetDisabledState: 'whenDisabledForLegacyCode' }) (or ReactiveFormsModule, if that's what you're using).

Nils Kähler
  • 2,645
  • 1
  • 21
  • 26
  • I have added 2 control with same formControlName as per the requirement and based on condition only one is visible at a time so I need to disabled condition in template – Joya Apr 18 '23 at 06:26