test(select): add demo for the selected text

references #7341

src/components/select/select.ts

@@ -184,9 +184,9 @@ export class Select implements AfterContentInit, ControlValueAccessor, OnDestroy
    * @input {string} The interface the select should use: `action-sheet` or `alert`. Default: `alert`.
    */
   @Input() interface: string = '';
-  
+
   /**
-   * @input {string} The selected text should be showen.
+   * @input {string} The text to display instead of the selected option's value.
    */
   @Input() selectedText: string = '';
 

src/components/select/test/single-value/index.ts

@@ -1,38 +1,57 @@
 import {Component} from '@angular/core';
 import {ionicBootstrap} from '../../../../../src';
 
+export interface Currency {
+  symbol: string;
+  code: string;
+  name: string;
+}
 
 @Component({
   templateUrl: 'main.html'
 })
 class E2EPage {
-  musicAlertOpts: any;
+  musicAlertOpts: any = {
+    title: '1994 Music',
+    subTitle: 'Select your favorite',
+    cssClass: 'music-select'
+  };
   gender: string;
-  gaming: string;
-  os: string;
-  music: string;
-  month: string;
-  year: string;
-  years: Array<number>;
-  notification: string;
-  status: string;
+  gaming: string = '';
+  os: string = 'win3.1';
+  years: Array<number> = [1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999];
+  music: string = null;
+  month: string = '12';
+  year: string = '1994';
+  notification: string = 'enable';
+  status: string = "checked";
+
+  currencies: Currency[] = [
+    {
+      symbol: '$',
+      code: 'USD',
+      name: 'US Dollar'
+    },
+    {
+      symbol: '€',
+      code: 'EUR',
+      name: 'Euro'
+    },
+    {
+      symbol: '£',
+      code: 'FKP',
+      name: 'Falkland Islands Pound'
+    },
+    {
+      symbol: '¢',
+      code: 'GHS',
+      name: 'Ghana Cedi'
+    }
+  ];
+  currency: Currency;
 
   constructor() {
-    this.gaming = '';
-    this.os = 'win3.1';
-    this.music = null;
-    this.month = '12';
-    this.year = '1994';
-    this.notification = 'enable';
-    this.status = "checked";
-
-    this.years = [1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999];
-
-    this.musicAlertOpts = {
-      title: '1994 Music',
-      subTitle: 'Select your favorite',
-      cssClass: 'music-select'
-    };
+    this.currency = this.currencies[0];
   }
 
   gamingCancel() {
@@ -50,6 +69,10 @@ class E2EPage {
   resetGender() {
     this.gender = null;
   }
+
+  selectedText() {
+    return this.currency.symbol;
+  }
 }
 
 

src/components/select/test/single-value/main.html

@@ -95,6 +95,15 @@
     </ion-select>
   </ion-item>
 
+  <ion-item>
+    <ion-label>Currency</ion-label>
+    <ion-select [(ngModel)]="currency" [selectedText]="selectedText()">
+      <ion-option *ngFor="let cur of currencies" [value]="cur">
+        {{cur.symbol}} ({{cur.code}}) {{cur.name}}
+      </ion-option>
+    </ion-select>
+  </ion-item>
+
   <button (click)="resetGender()">Reset Gender</button>
 
   <p aria-hidden="true" padding>
@@ -108,6 +117,8 @@
     <br>
     <code>date: {{month}}/{{year}}</code>
     <br>
+    <code>currency: {{currency | json}}</code>
+    <br>
   </p>
 
 </ion-content>