ตรวจจับการเปลี่ยนแปลงของ ngModel บนแท็กที่เลือก (Angular 2)

ฉันกำลังพยายามตรวจพบการเปลี่ยนแปลงngModelใน<select>แท็ก ใน Angular 1.x เราอาจแก้ปัญหานี้ด้วยการ$watchเปิดngModelหรือใช้ngChangeแต่ฉันยังไม่เข้าใจวิธีตรวจจับการเปลี่ยนแปลงngModelใน Angular 2

ตัวอย่างเต็ม : 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);
  }

}

ดังที่เราเห็นหากเราเลือกค่าที่แตกต่างจากดรอปดาวน์ngModelการเปลี่ยนแปลงของเราและนิพจน์ที่ถูกแทรกในมุมมองจะสะท้อนถึงสิ่งนี้

ฉันจะรับแจ้งการเปลี่ยนแปลงนี้ในชั้นเรียน / คอนโทรลเลอร์ได้อย่างไร

อัปเดต :

แยกเหตุการณ์และการเชื่อมโยงคุณสมบัติ:

<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 ...
}

คุณยังสามารถใช้

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

จากนั้นคุณจะไม่ต้องอัปเดตโมเดลในตัวจัดการเหตุการณ์ แต่ฉันเชื่อว่าสิ่งนี้ทำให้สองเหตุการณ์เริ่มทำงานดังนั้นจึงอาจมีประสิทธิภาพน้อยกว่า

คำตอบเก่าก่อนที่จะแก้ไขข้อบกพร่องในเบต้า 1:

สร้างตัวแปรเทมเพลตโลคัลและแนบ(change)เหตุการณ์:

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

plunker

ดูเพิ่มเติมฉันจะรับตัวเลือกใหม่ใน "เลือก" ใน Angular 2 ได้อย่างไร

ฉันเจอคำถามนี้และจะส่งคำตอบว่าใช้แล้วได้ผลดี ฉันมีช่องค้นหาที่กรองและจัดเรียงวัตถุและในช่องค้นหาของฉันฉันใช้ไฟล์(ngModelChange)="onChange($event)"

ในไฟล์ .html

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

จากนั้นในไฟล์ component.ts

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