Angular 2選擇（更改）事件，不更新下拉菜單中的值

Question

當選擇下拉更改時，我調用(change)指令的方法來檢查是否允許選擇的值，如果不允許選擇的值，則選擇再次返回上一個值（還原下拉菜單中的更改），但下拉菜單中的選定值仍顯示新的選定值，但ngModel變量是以前的值，例如：

我選擇改變從A到B

HTML：

<select (change)="doCheck()" [(ngModel)]="test"> 
    <option [ngValue]="1">A</option> 
    <option [ngValue]="2">B</option> 
</select> 

組件：

test: number = 1; 

doCheck(){ 
    //Not allowed to change to B, so change back to A 
    this.test = 1; 
} 

的test變量值1，而B是仍然在下拉列表中選中。

但是，當我在this.test = 1上添加setTimeout時，該值將變回A，但我不想在我的代碼中隨處添加setTimeout。

任何幫助將不勝感激

Answer 1

使用ngModelChange代替

<select (ngModelChange)="doCheck()" [(ngModel)]="test"> 

確保doCheck()是ngModel更新test

角並不能保證事件綁定之後調用在任何特定的順序處理。但ngModelChange在更新模型後由NgModel發出。

如果修改值回那ngModel沒有更新，你可能需要

constructor(private cdRef:ChangeDetectorRef) {} 

doCheck(){ 
    //Not allowed to change to B, so change back to A 
    this.test = 1; 
    this.cdRef.detectChanges(); 
} 

否則ngModel可能保持舊值。