Description
Bug, feature request, or proposal:
Bug
What is the expected behavior?
Given I have a form group with a slide toggle set as disabled: true
When recreating the form group with the slide toggle set as disabled: false
Then the slide toggle should be enabled.
Given I have a form group with a slide toggle set as disabled: false
When recreating the form group with the slide toggle set as disabled: true
Then the slide toggle should be disabled.
What is the current behavior?
After first form group initialization, the slide toggle state isn't affected by the disabled setting in subsequent form group initialization.
What are the steps to reproduce?
In an Angular component, with a formGroup:
this.formGroup = this.formBuilder.group({
input: [{value: '', disabled: false}],
slideToggle: [{value: '', disabled: false}]
});
And a form template:
<form class="example-form" [formGroup]="formGroup">
<input matInput formControlName="input" />
<mat-slide-toggle formControlName="slideToggle">Slide Toggle</mat-slide-toggle>
</form>
At any point during the lifetime of the component, recreate the form group but with a different disabled state for the controls:
this.formGroup = this.formBuilder.group({
input: [{value: '', disabled: true}],
slideToggle: [{value: '', disabled: true}]
});
The input will have correctly changed disabled state, however the slide toggle will not.
https://stackblitz.com/edit/angular-material2-issue-slide-toggle
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular 4.4.6
Angular Material 2.0.0-beta.12
tested in Chrome