fix(checkbox): set disabled state from FormControl

ionic-team · Jan 12, 2017 · b44ff41 · b44ff41
1 parent 14839b6
commit b44ff41
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 6 deletions.
diff --git a/src/components/checkbox/checkbox.ts b/src/components/checkbox/checkbox.ts
@@ -231,6 +231,13 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
     this._init = true;
   }
 
+  /**
+   * @private
+   */
+  setDisabledState(isDisabled: boolean) {
+    this.disabled = isDisabled;
+  }
+
   /**
    * @private
    */

diff --git a/src/components/checkbox/test/basic/app-module.ts b/src/components/checkbox/test/basic/app-module.ts
@@ -17,8 +17,8 @@ export class E2EPage {
 
   appleCtrl = new FormControl(true);
   bananaCtrl = new FormControl(true);
-  cherryCtrl = new FormControl(false);
-  grapeCtrl = new FormControl(true);
+  cherryCtrl = new FormControl({value: false, disabled: true});
+  grapeCtrl = new FormControl({value: true, disabled: true});
 
   fruitsForm = new FormGroup({
     'apple': this.appleCtrl,
@@ -28,7 +28,6 @@ export class E2EPage {
   });
 
   constructor() {
-    this.grapeDisabled = true;
     this.grapeChecked = true;
     this.standAloneChecked = true;
   }
@@ -38,7 +37,7 @@ export class E2EPage {
   }
 
   toggleGrapeDisabled() {
-    this.grapeDisabled = !this.grapeDisabled;
+    this.fruitsForm.get('grape').enabled ? this.fruitsForm.get('grape').disable() : this.fruitsForm.get('grape').enable();
   }
 
   kiwiChange(checkbox: Checkbox) {

diff --git a/src/components/checkbox/test/basic/main.html b/src/components/checkbox/test/basic/main.html
@@ -25,12 +25,12 @@
 
       <ion-item>
         <ion-label>Cherry, formControlName, disabled</ion-label>
-        <ion-checkbox disabled="true" formControlName="cherry"></ion-checkbox>
+        <ion-checkbox formControlName="cherry"></ion-checkbox>
       </ion-item>
 
       <ion-item>
         <ion-label>Grape, formControlName, checked, disabled</ion-label>
-        <ion-checkbox [checked]="grapeChecked" [disabled]="grapeDisabled" formControlName="grape"></ion-checkbox>
+        <ion-checkbox [checked]="grapeChecked" formControlName="grape"></ion-checkbox>
       </ion-item>
 
       <ion-item>