fix(range): update the UI when min/max change (#11720)

fixes #11719
This commit is contained in:
Shane Smith
2017-05-19 13:19:12 -04:00
committed by Brandy Carney
parent a6d1e12a94
commit d86785c376
3 changed files with 15 additions and 1 deletions

View File

@ -146,6 +146,7 @@ export class Range extends BaseInput<any> implements AfterContentInit, ControlVa
val = Math.round(val);
if (!isNaN(val)) {
this._min = val;
this._inputUpdated();
}
}
@ -160,6 +161,7 @@ export class Range extends BaseInput<any> implements AfterContentInit, ControlVa
val = Math.round(val);
if (!isNaN(val)) {
this._max = val;
this._inputUpdated();
}
}

View File

@ -92,6 +92,14 @@
<ion-range min="1000" max="2000" step="100" pin="true" snaps="true" [(ngModel)]="singleValue4"></ion-range>
</ion-item>
<ion-item>
<ion-label>dynamic min and max</ion-label>
<ion-range [min]="min" [max]="max" [(ngModel)]="singeValue5">
<ion-label range-left><input type="text" style="width: 50px;" [(ngModel)]="min" /></ion-label>
<ion-label range-right><input type="text" style="width: 50px;" [(ngModel)]="max" /></ion-label>
</ion-range>
</ion-item>
<ion-item>
<ion-label>dual, pin, {{dualValue | json}}</ion-label>
<ion-range dualKnobs="true" pin="true" [(ngModel)]="dualValue"></ion-range>
@ -117,4 +125,4 @@
</ion-list>
</form>
</ion-content>
</ion-content>

View File

@ -10,9 +10,13 @@ export class RootPage {
singleValue2: number = 150;
singleValue3: number = 64;
singleValue4: number = 1300;
singleValue5: number = 0;
dualValue: any;
dualValue2 = {lower: 33, upper: 60};
min: number = -50;
max: number = 50;
rangeCtrl = new FormControl({value: '66', disabled: true});
dualRangeCtrl = new FormControl({value: {lower: 33, upper: 60}, disabled: true});