fix(slide-toggle) disabled state from a FormControl not updating (#4797)

When setting the disabled state of a slide-toggle using the FormControl's `enable()` and `disable()` methods the slide-toggle's view won't be updated properly.

Fixes #4774
This commit is contained in:
Paul Gschwendtner
2017-06-05 23:42:37 +02:00
committed by Andrew Seguin
parent 7af93bc5e3
commit a9ad62d0fa
2 changed files with 9 additions and 1 deletions
@@ -618,6 +618,7 @@ describe('MdSlideToggle', () => {
let testComponent: SlideToggleWithFormControl;
let slideToggle: MdSlideToggle;
let inputElement: HTMLInputElement;
beforeEach(() => {
fixture = TestBed.createComponent(SlideToggleWithFormControl);
@@ -625,20 +626,24 @@ describe('MdSlideToggle', () => {
testComponent = fixture.debugElement.componentInstance;
slideToggle = fixture.debugElement.query(By.directive(MdSlideToggle)).componentInstance;
inputElement = fixture.debugElement.query(By.css('input')).nativeElement;
});
it('should toggle the disabled state', () => {
expect(slideToggle.disabled).toBe(false);
expect(inputElement.disabled).toBe(false);
testComponent.formControl.disable();
fixture.detectChanges();
expect(slideToggle.disabled).toBe(true);
expect(inputElement.disabled).toBe(true);
testComponent.formControl.enable();
fixture.detectChanges();
expect(slideToggle.disabled).toBe(false);
expect(inputElement.disabled).toBe(false);
});
});
});
+4 -1
View File
@@ -1,6 +1,7 @@
import {
AfterContentInit,
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
ElementRef,
EventEmitter,
@@ -121,7 +122,8 @@ export class MdSlideToggle extends _MdSlideToggleMixinBase
constructor(private _elementRef: ElementRef,
private _renderer: Renderer2,
private _focusOriginMonitor: FocusOriginMonitor) {
private _focusOriginMonitor: FocusOriginMonitor,
private _changeDetectorRef: ChangeDetectorRef) {
super();
}
@@ -190,6 +192,7 @@ export class MdSlideToggle extends _MdSlideToggleMixinBase
/** Implemented as a part of ControlValueAccessor. */
setDisabledState(isDisabled: boolean): void {
this.disabled = isDisabled;
this._changeDetectorRef.markForCheck();
}
/** Focuses the slide-toggle. */