javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 21:48:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(range): prevent change detection exception

Browse Source
This commit is contained in:
Adam Bradley
2016-06-01 16:11:47 -05:00
parent cffa84c97e
commit 7e4b13daaf
2 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/range/range.ts
View File

@ -4,7 +4,7 @@ import {NG_VALUE_ACCESSOR} from '@angular/common';
import {Form} from '../../util/form'; import {Form} from '../../util/form';
import {isTrueProperty, isNumber, isString, isPresent, clamp} from '../../util/util'; import {isTrueProperty, isNumber, isString, isPresent, clamp} from '../../util/util';
import {Item} from '../item/item'; import {Item} from '../item/item';
import {pointerCoord, Coordinates} from '../../util/dom'; import {pointerCoord, Coordinates, raf} from '../../util/dom';
const RANGE_VALUE_ACCESSOR = new Provider( const RANGE_VALUE_ACCESSOR = new Provider(
@ -343,11 +343,11 @@ export class Range {
this._renderer.setElementStyle(this._bar.nativeElement, 'left', barL); this._renderer.setElementStyle(this._bar.nativeElement, 'left', barL);
this._renderer.setElementStyle(this._bar.nativeElement, 'right', barR); this._renderer.setElementStyle(this._bar.nativeElement, 'right', barR);
this.createTicks();
// add touchstart/mousedown listeners // add touchstart/mousedown listeners
this._renderer.listen(this._slider.nativeElement, 'touchstart', this.pointerDown.bind(this)); this._renderer.listen(this._slider.nativeElement, 'touchstart', this.pointerDown.bind(this));
this._mouseRemove = this._renderer.listen(this._slider.nativeElement, 'mousedown', this.pointerDown.bind(this)); this._mouseRemove = this._renderer.listen(this._slider.nativeElement, 'mousedown', this.pointerDown.bind(this));
this.createTicks();
} }
/** /**
@ -544,18 +544,18 @@ export class Range {
*/ */
createTicks() { createTicks() {
if (this._snaps) { if (this._snaps) {
this._ticks = []; raf(() => {
for (var value = this._min; value <= this._max; value += this._step) { // TODO: Fix to not use RAF
var ratio = this.valueToRatio(value); this._ticks = [];
this._ticks.push({ for (var value = this._min; value <= this._max; value += this._step) {
ratio: ratio, var ratio = this.valueToRatio(value);
left: `${ratio * 100}%`, this._ticks.push({
}); ratio: ratio,
} left: `${ratio * 100}%`,
this.updateTicks(); });
}
} else { this.updateTicks();
this._ticks = null; });
} }
} }

4
src/components/range/test/basic/index.ts
View File

@ -1,5 +1,5 @@
import {Component} from '@angular/core'; import {Component} from '@angular/core';
import {ionicBootstrap} from '../../../../../src'; import {ionicBootstrap, Range} from '../../../../../src';
@Component({ @Component({
@ -13,7 +13,7 @@ class Page1 {
dualValue: any; dualValue: any;
dualValue2 = {lower: 33, upper: 60}; dualValue2 = {lower: 33, upper: 60};
rangeChange(ev) { rangeChange(ev: Range) {
console.log(`range, change, ratio: ${ev.ratio}, value: ${ev.value}`); console.log(`range, change, ratio: ${ev.ratio}, value: ${ev.value}`);
} }