Property value from select is undefined


#1

In a select ionChange event, the value of selected option is undefined and the property doens’t exists

HomePage.html

<ion-list>
   <ion-item>
    <ion-label>Raças</ion-label>
      <ion-select #racas (ionChange)="teste(racas.value);">
        <ion-option value="humanos">Humanos</ion-option>
        <ion-option value="anoes">Anões</ion-option>
        <ion-option value="elfos">Elfos</ion-option>
        <ion-option value="gnomos">Gnomos</ion-option>
        <ion-option value="meio-elfos">Meio-elfos</ion-option>
        <ion-option value="meio-orcs">Meio-orcs</ion-option>
        <ion-option value="halfling">Halfling</ion-option>
      </ion-select>
    </ion-item>
  </ion-list>

HomePage.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'app/home.page.html'
})
export class HomePage {

  teste(racas:any) {
      
        console.log(racas.value);
      
  }
}

Result of console.log(racas);


_componentName
:
"select"
_config
:
Config
_disabled
:
false
_elementRef
:
ElementRef
_form
:
Form
_isOpen
:
false
_item
:
Item
_labelId
:
"lbl-0"
_mode
:
"md"
_multi
:
false
_nav
:
Nav
_options
:
QueryList
_renderer
:
DebugDomRenderer
_text
:
"Humanos"
_texts
:
Array(1)
_values
:
Array(1)
__proto__
:
Ion

A example in plnkr


#2

try (ionChange)=“teste($event)”

and then console.log(racas);


#3

Work’s fine! Where i should read about $events?

@edit

I found about event binding