Skip to content

Commit 3314414

Browse files
fix(material/slider): Tick marks changes position as the slider is changed (for a step that is decimal number) (angular#29108)
Fixes the bug in the Angular Material 'slider' component. Changed the function in the calculation from .floor to .round Due to floating-point precision in JavaScript. (1 - 0.9) / 0.1 evaluates to 0.9999999999999999 Even though mathematically it should be 1 The calculation in the code resulted in slightly smaller value. Math.floor(0.9999999999999999) evaluates to 0. Math.round(0.9999999999999999) evaluates to 1. Fixes angular#29084
1 parent 5f93316 commit 3314414

File tree

1 file changed

+5
-5
lines changed

1 file changed

+5
-5
lines changed

src/material/slider/slider.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -870,8 +870,8 @@ export class MatSlider implements AfterViewInit, OnDestroy, _MatSlider {
870870

871871
private _updateTickMarkUINonRange(step: number): void {
872872
const value = this._getValue();
873-
let numActive = Math.max(Math.floor((value - this.min) / step), 0);
874-
let numInactive = Math.max(Math.floor((this.max - value) / step), 0);
873+
let numActive = Math.max(Math.round((value - this.min) / step), 0);
874+
let numInactive = Math.max(Math.round((this.max - value) / step), 0);
875875
this._isRtl ? numActive++ : numInactive++;
876876

877877
this._tickMarks = Array(numActive)
@@ -883,9 +883,9 @@ export class MatSlider implements AfterViewInit, OnDestroy, _MatSlider {
883883
const endValue = this._getValue();
884884
const startValue = this._getValue(_MatThumb.START);
885885

886-
const numInactiveBeforeStartThumb = Math.max(Math.floor((startValue - this.min) / step), 0);
887-
const numActive = Math.max(Math.floor((endValue - startValue) / step) + 1, 0);
888-
const numInactiveAfterEndThumb = Math.max(Math.floor((this.max - endValue) / step), 0);
886+
const numInactiveBeforeStartThumb = Math.max(Math.round((startValue - this.min) / step), 0);
887+
const numActive = Math.max(Math.round((endValue - startValue) / step) + 1, 0);
888+
const numInactiveAfterEndThumb = Math.max(Math.round((this.max - endValue) / step), 0);
889889
this._tickMarks = Array(numInactiveBeforeStartThumb)
890890
.fill(_MatTickMark.INACTIVE)
891891
.concat(

0 commit comments

Comments
 (0)