Allow setting enabled/disabled state of AbstractControl using a boolean value
- Dominant language
- TypeScript
- Stars
- 101k
- Forks
- 27.5k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 288
Description
### Which @angular/* package(s) are relevant/related to the feature request?
_No response_
### Description
Currently, in order to disable or enable an `AbstractControl` depending on another control's value or state, one has to use very verbose explicit code using both if/else branches of a condition:
```ts
.subscribe(value => {
if(valueMeetsCondition(value)){
this.ctrl.enable()
} else {
this.ctrl.disable()
}
});
```
or its ternary equivalent.
It would simplify the code if we could say this instead:
```ts
.subscribe(value => this.ctrl.setEnabledState(valueMeetsCondition(value)));
```
### Proposed solution
In [AbstractControl API](https://angular.io/api/forms/AbstractControl), add a pair of methods that accept a boolean value:
- `setDisabledState`
```ts
setDisabledState(isDisabled: boolean, opts: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
```
- `setEnabledState`
```ts
setEnabledState(isEnabled: boolean, opts: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
```
I think it's important to have a pair of companions, just like we have `valid`/`invalid`, `enabled`/`disabled` property pairs on [AbstractControl](https://angular.io/api/forms/AbstractControl#abstractcontrol) for the sake of coding convenience.
It would allow developers for a smoother migration and cleaner code without the need of negating the conditions in their existing code.
### Alternatives considered
Workarounds? Described above which I want to stop using.
Alternative solutions? Can't think of any.
Contributor guide
Research direction
The change targets Angular's AbstractControl API; start by locating the existing enable and disable methods and reviewing their options. Done means boolean setEnabledState and setDisabledState methods are available with the proposed options and cover the conditional usage described in the issue.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- api, frontend
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 45/100