Deteksi perubahan ke ngModel pada tag pilih (Angular 2)

Saya mencoba untuk mendeteksi perubahan pada ngModeldalam <select>tag. Di Angular 1.x, kita mungkin menyelesaikan ini dengan $watchon ngModel, atau dengan menggunakan ngChange, tapi saya belum memahami cara mendeteksi perubahan ngModeldi Angular 2.

Contoh Lengkap : http://plnkr.co/edit/9c9oKH1tjDDb67zdKmr9?p=info

import {Component, View, Input, } from 'angular2/core';
import {FORM_DIRECTIVES} from 'angular2/common';

@Component({
    selector: 'my-dropdown'
})
@View({
    directives: [FORM_DIRECTIVES],
    template: `
        <select [ngModel]="selection" (ngModelChange)="onChange($event, selection)" >
            <option *ngFor="#option of options">{{option}}</option>
        </select>
        {{selection}}
    `
})
export class MyDropdown {
    @Input() options;

    selection = 'Dog';

    ngOnInit() {
        console.log('These were the options passed in: ' + this.options);
  }

  onChange(event) {
    if (this.selection === event) return;
    this.selection = event;
    console.log(this.selection);
  }

}

Seperti yang bisa kita lihat, jika kita memilih nilai yang berbeda dari tarik-turun, ngModelperubahan kita , dan ekspresi yang diinterpolasi dalam tampilan mencerminkan hal ini.

Bagaimana cara mendapatkan pemberitahuan tentang perubahan ini di kelas / pengontrol saya?

Pembaruan :

Pisahkan acara dan pengikatan properti:

<select [ngModel]="selectedItem" (ngModelChange)="onChange($event)">

onChange(newValue) {
    console.log(newValue);
    this.selectedItem = newValue;  // don't forget to update the model here
    // ... do other stuff here ...
}

Anda juga bisa menggunakan

<select [(ngModel)]="selectedItem" (ngModelChange)="onChange($event)">

dan kemudian Anda tidak perlu memperbarui model di event handler, tapi saya yakin ini menyebabkan dua peristiwa diaktifkan, jadi mungkin kurang efisien.

Jawaban lama, sebelum mereka memperbaiki bug di beta.1:

Buat variabel template lokal dan lampirkan (change)acara:

<select [(ngModel)]="selectedItem" #item (change)="onChange(item.value)">

plunker

Lihat juga Bagaimana saya bisa mendapatkan pilihan baru di "pilih" di Angular 2?

Saya telah menemukan pertanyaan ini dan saya akan mengirimkan jawaban saya yang saya gunakan dan bekerja dengan cukup baik. Saya memiliki kotak pencarian yang memfilter dan berbagai objek dan pada kotak pencarian saya, saya menggunakan(ngModelChange)="onChange($event)"

di saya .html

<input type="text" [(ngModel)]="searchText" (ngModelChange)="reSearch(newValue)" placeholder="Search">

lalu di saya component.ts

reSearch(newValue: string) {
    //this.searchText would equal the new value
    //handle my filtering with the new value
}