mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(progress-spinner): value not updated while in indeterminate mode (#8269)
Fixes updates to a spinner's value not being saved if they happen while the component is indeterminate, causing it to be wrong if it becomes determinate again.
This commit is contained in:
committed by
tinayuangao
parent
2b9bc5769a
commit
9b68b54cd2
@@ -58,6 +58,27 @@ describe('MatProgressSpinner', () => {
|
||||
expect(progressElement.componentInstance.value).toBe(0);
|
||||
});
|
||||
|
||||
it('should retain the value if it updates while indeterminate', () => {
|
||||
let fixture = TestBed.createComponent(ProgressSpinnerWithValueAndBoundMode);
|
||||
let progressElement = fixture.debugElement.query(By.css('mat-progress-spinner'));
|
||||
|
||||
fixture.componentInstance.mode = 'determinate';
|
||||
fixture.detectChanges();
|
||||
expect(progressElement.componentInstance.value).toBe(50);
|
||||
|
||||
fixture.componentInstance.mode = 'indeterminate';
|
||||
fixture.detectChanges();
|
||||
expect(progressElement.componentInstance.value).toBe(0);
|
||||
|
||||
fixture.componentInstance.value = 75;
|
||||
fixture.detectChanges();
|
||||
expect(progressElement.componentInstance.value).toBe(0);
|
||||
|
||||
fixture.componentInstance.mode = 'determinate';
|
||||
fixture.detectChanges();
|
||||
expect(progressElement.componentInstance.value).toBe(75);
|
||||
});
|
||||
|
||||
it('should clamp the value of the progress between 0 and 100', () => {
|
||||
let fixture = TestBed.createComponent(BasicProgressSpinner);
|
||||
fixture.detectChanges();
|
||||
@@ -222,8 +243,13 @@ class ProgressSpinnerCustomDiameter {
|
||||
@Component({template: '<mat-progress-spinner mode="indeterminate"></mat-progress-spinner>'})
|
||||
class IndeterminateProgressSpinner { }
|
||||
|
||||
@Component({template: '<mat-progress-spinner value="50" [mode]="mode"></mat-progress-spinner>'})
|
||||
class ProgressSpinnerWithValueAndBoundMode { mode = 'indeterminate'; }
|
||||
@Component({
|
||||
template: '<mat-progress-spinner [value]="value" [mode]="mode"></mat-progress-spinner>'
|
||||
})
|
||||
class ProgressSpinnerWithValueAndBoundMode {
|
||||
mode = 'indeterminate';
|
||||
value = 50;
|
||||
}
|
||||
|
||||
@Component({template: `<mat-spinner [color]="color"></mat-spinner>`})
|
||||
class SpinnerWithColor { color: string = 'primary'; }
|
||||
|
||||
@@ -145,9 +145,7 @@ export class MatProgressSpinner extends _MatProgressSpinnerMixinBase implements
|
||||
return this.mode === 'determinate' ? this._value : 0;
|
||||
}
|
||||
set value(newValue: number) {
|
||||
if (newValue != null && this.mode === 'determinate') {
|
||||
this._value = Math.max(0, Math.min(100, coerceNumberProperty(newValue)));
|
||||
}
|
||||
this._value = Math.max(0, Math.min(100, coerceNumberProperty(newValue)));
|
||||
}
|
||||
|
||||
constructor(public _elementRef: ElementRef,
|
||||
|
||||
Reference in New Issue
Block a user