在Angular2中設置ngmodel后，如何確保選擇更改事件觸發？

Question

我有一個select元素，它附帶一個基本（更改）處理程序以及一個ngmodel。 設置帶有ng值的<option>時，將觸發更改處理程序。 問題是[（ngModel）還沒有新的值。

<div>
        <button style="margin: 8px 0;" (click)="getNextLink()" class="btn btn-primary btn-sm pull-right">Next Label ></button>
        <div class="form-group">
            <label for="filter-word">Select Word To Filter:</label>
            <select [(ngModel)]="selectedLabels[selectedLabels.length]"
                    (change)="onChange($event)"
                    class="form-control"
                    id="filter-word"
                    name="filter-word">
                <option *ngFor="let label of (primaryTopic.topics) | stringFilter: selectedLabels" [ngValue]="label">
                    {{label}}
                </option>
            </select>
        </div>
    </div>

這是組件代碼：

  public onChange(event: any): void {
    console.log('event', event);
    console.log('this.selectedLabels', this.selectedLabels); // undefined
    debugger; 
  }

如何更新ngModel時，我該如何回復？

Answer 1

改為使用ngModelChange ：

(ngModelChange)="onChange($event)"

無法指定應執行事件處理程序的順序。 因為ngModelChange本身是在綁定屬性更新后由NgModel發出的，所以這應該符合您的需要。