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 @@