From e19d4e38c08d532b3747ba85240d8e7a048acaba Mon Sep 17 00:00:00 2001
From: Adam Bradley <adambradley25@gmail.com>
Date: Wed, 27 Jan 2016 13:16:07 -0600
Subject: [PATCH] feat(select): emit change and select events

Closes #5219
---
 ionic/components/option/option.ts               |  4 +++-
 ionic/components/select/select.ts               | 17 ++++++++++-------
 .../select/test/multiple-value/index.ts         |  8 +++++++-
 .../select/test/multiple-value/main.html        |  2 +-
 .../select/test/single-value/index.ts           |  4 ++++
 .../select/test/single-value/main.html          |  2 +-
 6 files changed, 26 insertions(+), 11 deletions(-)

diff --git a/ionic/components/option/option.ts b/ionic/components/option/option.ts
index d1c0fca995..2ca37584f1 100644
--- a/ionic/components/option/option.ts
+++ b/ionic/components/option/option.ts
@@ -1,4 +1,4 @@
-import {Directive, ElementRef, Input} from 'angular2/core';
+import {Directive, ElementRef, Input, Output, EventEmitter} from 'angular2/core';
 
 import {isDefined, isTrueProperty} from '../../util/util';
 
@@ -12,6 +12,8 @@ export class Option {
   private _checked: any = false;
   private _value;
 
+  @Output() select: EventEmitter<any> = new EventEmitter();
+
   constructor(private _elementRef: ElementRef) {}
 
   @Input()
diff --git a/ionic/components/select/select.ts b/ionic/components/select/select.ts
index a1e1f192b8..b2dde622c6 100644
--- a/ionic/components/select/select.ts
+++ b/ionic/components/select/select.ts
@@ -1,4 +1,4 @@
-import {Component, Optional, ElementRef, Renderer, Input, HostListener, ContentChildren, QueryList} from 'angular2/core';
+import {Component, Optional, ElementRef, Renderer, Input, Output, EventEmitter, HostListener, ContentChildren, QueryList} from 'angular2/core';
 import {NgControl} from 'angular2/common';
 
 import {Alert} from '../alert/alert';
@@ -124,6 +124,8 @@ export class Select {
   @Input() disabled: boolean = false;
   @Input() multiple: string = '';
 
+  @Output() change: EventEmitter<any> = new EventEmitter();
+
   @ContentChildren(Option) options: QueryList<Option>;
 
   constructor(
@@ -162,6 +164,7 @@ export class Select {
       if (option.checked) {
         selectedValues.push( isDefined(option.value) ? option.value : option.text );
         selectedTexts.push(option.text);
+        option.select.emit(option.value);
       }
     });
 
@@ -227,6 +230,7 @@ export class Select {
             if (selectedValues.indexOf(option.value) > -1) {
               // this option is one that was checked
               option.checked = true;
+              option.select.emit(option.value);
               selectedTexts.push(option.text);
 
             } else {
@@ -238,6 +242,7 @@ export class Select {
           this.text = selectedTexts.join(', ');
 
           this.onChange(selectedValues);
+          this.change.emit(selectedValues);
         }
       });
 
@@ -257,6 +262,7 @@ export class Select {
             if (option.value === selectedValue) {
               // this option was the one that was checked
               option.checked = true;
+              option.select.emit(option.value);
               this.text = option.text;
 
             } else {
@@ -266,6 +272,7 @@ export class Select {
           });
 
           this.onChange(selectedValue);
+          this.change.emit(selectedValue);
         }
       });
     }
@@ -288,16 +295,12 @@ export class Select {
   /**
    * @private
    */
-  onChange(val) {
-    // TODO: figure the whys and the becauses
-  }
+  onChange(val) {}
 
   /**
    * @private
    */
-  onTouched(val) {
-    // TODO: figure the whys and the becauses
-  }
+  onTouched(val) {}
 
   /**
    * @private
diff --git a/ionic/components/select/test/multiple-value/index.ts b/ionic/components/select/test/multiple-value/index.ts
index 8431db8c60..5f3d5ee268 100644
--- a/ionic/components/select/test/multiple-value/index.ts
+++ b/ionic/components/select/test/multiple-value/index.ts
@@ -4,7 +4,13 @@ import {App, Page} from 'ionic/ionic';
 @Page({
   templateUrl: 'main.html'
 })
-class E2EPage {}
+class E2EPage {
+
+  carChange(selectedValues) {
+    console.log('carChange', selectedValues);
+  }
+
+}
 
 
 @App({
diff --git a/ionic/components/select/test/multiple-value/main.html b/ionic/components/select/test/multiple-value/main.html
index 9002cdefc2..ac753db094 100644
--- a/ionic/components/select/test/multiple-value/main.html
+++ b/ionic/components/select/test/multiple-value/main.html
@@ -22,7 +22,7 @@
 
   <ion-item>
     <ion-label>Car Options</ion-label>
-    <ion-select [(ngModel)]="carOptions" multiple="true">
+    <ion-select [(ngModel)]="carOptions" multiple="true" (change)="carChange($event)">
       <ion-option value="backupcamera">Backup Camera</ion-option>
       <ion-option value="heatedseats">Headted Seats</ion-option>
       <ion-option value="keyless">Keyless Entry</ion-option>
diff --git a/ionic/components/select/test/single-value/index.ts b/ionic/components/select/test/single-value/index.ts
index 528d2f998f..6f425b2638 100644
--- a/ionic/components/select/test/single-value/index.ts
+++ b/ionic/components/select/test/single-value/index.ts
@@ -11,6 +11,10 @@ class E2EPage {
       subTitle: 'Select your favorite'
     };
   }
+
+  stpSelect() {
+    console.log('STP selected')
+  }
 }
 
 
diff --git a/ionic/components/select/test/single-value/main.html b/ionic/components/select/test/single-value/main.html
index d00ef386c6..9efa2fa1a1 100644
--- a/ionic/components/select/test/single-value/main.html
+++ b/ionic/components/select/test/single-value/main.html
@@ -46,7 +46,7 @@
       <ion-option>Pearl Jam</ion-option>
       <ion-option>Smashing Pumpkins</ion-option>
       <ion-option>Soundgarden</ion-option>
-      <ion-option>Stone Temple Pilots</ion-option>
+      <ion-option (select)="stpSelect()">Stone Temple Pilots</ion-option>
     </ion-select>
   </ion-item>