mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(slider): unable to reset value by setting it back to undefined (#9768)
Fixes the slider value not being reset to zero if the consumer sets it to undefined. Fixes #9740.
This commit is contained in:
committed by
mmalerba
parent
0968c3a8e0
commit
171486ea54
@@ -12,7 +12,7 @@ import {
|
||||
} from '@angular/cdk/keycodes';
|
||||
import {dispatchFakeEvent, dispatchKeyboardEvent, dispatchMouseEvent} from '@angular/cdk/testing';
|
||||
import {Component, DebugElement, ViewChild} from '@angular/core';
|
||||
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
|
||||
import {async, ComponentFixture, TestBed, fakeAsync, flush} from '@angular/core/testing';
|
||||
import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
|
||||
import {By, HAMMER_GESTURE_CONFIG} from '@angular/platform-browser';
|
||||
import {MatSlider, MatSliderModule} from './index';
|
||||
@@ -1274,6 +1274,23 @@ describe('MatSlider with forms module', () => {
|
||||
|
||||
expect(testComponent.val).toBe(1);
|
||||
});
|
||||
|
||||
it('should be able to reset a slider by setting the model back to undefined', fakeAsync(() => {
|
||||
expect(testComponent.slider.value).toBe(0);
|
||||
|
||||
testComponent.val = 5;
|
||||
fixture.detectChanges();
|
||||
flush();
|
||||
|
||||
expect(testComponent.slider.value).toBe(5);
|
||||
|
||||
testComponent.val = undefined;
|
||||
fixture.detectChanges();
|
||||
flush();
|
||||
|
||||
expect(testComponent.slider.value).toBe(0);
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
describe('slider as a custom form control', () => {
|
||||
@@ -1464,7 +1481,8 @@ class SliderWithFormControl {
|
||||
styles: [styles],
|
||||
})
|
||||
class SliderWithNgModel {
|
||||
val = 0;
|
||||
@ViewChild(MatSlider) slider: MatSlider;
|
||||
val: number | undefined = 0;
|
||||
}
|
||||
|
||||
@Component({
|
||||
|
||||
@@ -238,7 +238,7 @@ export class MatSlider extends _MatSliderMixinBase
|
||||
}
|
||||
set value(v: number | null) {
|
||||
if (v !== this._value) {
|
||||
this._value = coerceNumberProperty(v, this._value || 0);
|
||||
this._value = coerceNumberProperty(v);
|
||||
this._percent = this._calculatePercentage(this._value);
|
||||
|
||||
// Since this also modifies the percentage, we need to let the change detection know.
|
||||
|
||||
Reference in New Issue
Block a user