diff --git a/src/components/range/range.ts b/src/components/range/range.ts index c9eae43c80..54e1984731 100644 --- a/src/components/range/range.ts +++ b/src/components/range/range.ts @@ -626,6 +626,13 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O */ onTouched() { } + /** + * @private + */ + setDisabledState(isDisabled: boolean) { + this.disabled = isDisabled; + } + /** * @private */ diff --git a/src/components/range/test/basic/app-module.ts b/src/components/range/test/basic/app-module.ts index 39c32e9e45..364794dbb4 100644 --- a/src/components/range/test/basic/app-module.ts +++ b/src/components/range/test/basic/app-module.ts @@ -1,4 +1,5 @@ import { Component, NgModule } from '@angular/core'; +import { FormControl, FormGroup } from '@angular/forms'; import { IonicApp, IonicModule, Range } from '../../../..'; @@ -13,6 +14,14 @@ export class Page1 { dualValue: any; dualValue2 = {lower: 33, upper: 60}; + rangeCtrl = new FormControl({value: '66', disabled: true}); + dualRangeCtrl = new FormControl({value: {lower: 33, upper: 60}, disabled: true}); + + rangeForm = new FormGroup({ + 'range': this.rangeCtrl, + 'dualRange': this.dualRangeCtrl + }); + rangeChange(range: Range) { console.log(`range, change, ratio: ${range.ratio}, value: ${range.value}`); } diff --git a/src/components/range/test/basic/page1.html b/src/components/range/test/basic/page1.html index 40de99d65a..96df50c141 100644 --- a/src/components/range/test/basic/page1.html +++ b/src/components/range/test/basic/page1.html @@ -101,7 +101,20 @@ dual, step=3, snaps, {{dualValue2 | json}} - +
+ + + disabled, range, formControlName + + + + + dual, disabled, formControlName + + + +
+