feat(select): cancel output event

Closes #5439
ionic-team · Feb 13, 2016 · 6a7c97d · 6a7c97d
1 parent 5034c1d
commit 6a7c97d
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 3 deletions.
diff --git a/ionic/components/select/select.ts b/ionic/components/select/select.ts
@@ -150,11 +150,15 @@ export class Select {
   @Input() checked: any = false;
 
   /**
-   * @private
    * @output {any} Any expression you want to evaluate when the selection has changed
    */
   @Output() change: EventEmitter<any> = new EventEmitter();
 
+  /**
+   * @output {any} Any expression you want to evaluate when the selection was cancelled
+   */
+  @Output() cancel: EventEmitter<any> = new EventEmitter();
+
   constructor(
     private _form: Form,
     private _elementRef: ElementRef,
@@ -196,7 +200,12 @@ export class Select {
 
     // make sure their buttons array is removed from the options
     // and we create a new array for the alert's two buttons
-    alertOptions.buttons = [this.cancelText];
+    alertOptions.buttons = [{
+      text: this.cancelText,
+      handler: () => {
+        this.cancel.emit(null);
+      }
+    }];
 
     // if the alertOptions didn't provide an title then use the label's text
     if (!alertOptions.title && this._item) {

diff --git a/ionic/components/select/test/single-value/index.ts b/ionic/components/select/test/single-value/index.ts
@@ -5,6 +5,9 @@ import {App, Page} from '../../../../../ionic/ionic';
   templateUrl: 'main.html'
 })
 class E2EPage {
+  musicAlertOpts;
+  gender: string;
+
   constructor() {
     this.musicAlertOpts = {
       title: '1994 Music',
@@ -16,6 +19,14 @@ class E2EPage {
     }, 1500);
   }
 
+  gamingCancel() {
+    console.log('Gaming Select, Cancel');
+  }
+
+  gamingChange(selectedValue) {
+    console.log('Gaming Select, Change value:', selectedValue);
+  }
+
   stpSelect() {
     console.log('STP selected')
   }
@@ -30,6 +41,8 @@ class E2EPage {
   template: '<ion-nav [root]="root"></ion-nav>'
 })
 class E2EApp {
+  root;
+
   constructor() {
     this.root = E2EPage;
   }

diff --git a/ionic/components/select/test/single-value/main.html b/ionic/components/select/test/single-value/main.html
@@ -14,7 +14,7 @@
 
   <ion-item>
     <ion-label>Gaming</ion-label>
-    <ion-select [(ngModel)]="gaming">
+    <ion-select [(ngModel)]="gaming" (cancel)="gamingCancel()" (change)="gamingChange($event)">
       <ion-option value="nes">NES</ion-option>
       <ion-option value="n64">Nintendo64</ion-option>
       <ion-option value="ps">PlayStation</ion-option>