javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 16:16:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(range): add debounce support

Browse Source
This commit is contained in:
mhartington
2017-12-05 13:52:43 -05:00
parent 9e7ae4b0df
commit 4b2e5d32c8
2 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/core/src/components/range/range.tsx
View File

@ -13,8 +13,6 @@ import { clamp } from '../../utils/helpers';
} }
}) })
export class Range implements BaseInputComponent { export class Range implements BaseInputComponent {
// private rangeId: string;
// private labelId: string;
private styleTmr: any; private styleTmr: any;
@ -128,7 +126,7 @@ export class Range implements BaseInputComponent {
@PropDidChange('value') @PropDidChange('value')
protected valueChanged(val: boolean) { protected valueChanged(val: boolean) {
this.ionChange.emit({ value: val }); setTimeout(() => this.ionChange.emit({value: val}), this.debounce);
this.emitStyle(); this.emitStyle();
} }

7
packages/core/src/components/range/test/basic/index.html
View File

@ -70,6 +70,9 @@
<ion-item> <ion-item>
<ion-range dual-knobs="true" id="multiKnob"></ion-range> <ion-range dual-knobs="true" id="multiKnob"></ion-range>
</ion-item> </ion-item>
<ion-item>
<ion-range id="debounce" debounce="5000"></ion-range>
</ion-item>
</ion-list> </ion-list>
<ion-button onclick="elTest()">Test</ion-button> <ion-button onclick="elTest()">Test</ion-button>
@ -79,6 +82,7 @@
<script> <script>
var knob = document.getElementById('multiKnob') var knob = document.getElementById('multiKnob')
var debounceRange = document.getElementById('debounce')
knob.value = { knob.value = {
lower: 33, lower: 33,
upper: 60 upper: 60
@ -92,6 +96,9 @@
knob.addEventListener('ionChange', function(ev) { knob.addEventListener('ionChange', function(ev) {
console.log('change', ev) console.log('change', ev)
}) })
debounceRange.addEventListener('ionChange', function(ev) {
console.log('change', ev)
})
function elTest() { function elTest() {
var range = document.getElementById('range'); var range = document.getElementById('range');