I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

When dealing with an ngForm, I want to disable all included controls so users cannot modify them, e.g. during submit.

<form (ngSubmit)="onSubmit()" #form="ngForm">
   <input [disabled]="disabled">
   <input disabled="true"> <!-- always disabled -->
</form>

I can access the above form from within the component controller to overwrite the formGroup states:

this.form.form.disable();
this.form.form.enable();

When doing this, first all controls get disabled, then all get enabled. Even the second form which has disabled="true" hard-coded gets enabled and there is no way to get it back to its self-governing state.

Expected behavior

There could be multiple solutions to this:

• the most specific attribute ([disabled] on the input) could take precedence.
• a "force" option in disable() and enable()
• a method on AbstractControl to reset the disabled state.

Minimal reproduction of the problem with instructions

http://plnkr.co/edit/M71eHXdG8DcNJOYZDuhe
The plnkr has two inputs: one "regular" and one is always disabled.
Click the submit button -> both inputs get disabled.
After the timeout -> both inputs get enabled.
The "always disabled" input cannot be reset.

What is the motivation / use case for changing the behavior?

If we can revert to the input disabled value, we can build forms that enforce a state during a certain process (e.g. async update) and then reset the disabled states after the async operation is completed.

Environment

Angular version: 4.4.1

Browser:

• Chrome (desktop) version XX
• Chrome (Android) version XX
• Chrome (iOS) version XX
• Firefox version XX
• Safari (desktop) version XX
• Safari (iOS) version XX
• IE version XX
• Edge version XX