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.

但是当我在setTimeout上添加this.test = 1时，值会更改回A，但我不想在代码中的任何位置添加setTimeout。

任何帮助将不胜感激

Answer 1

使用ngModelChange代替

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

确保在doCheck()更新ngModel

后调用test

Angular并不保证以任何特定顺序处理事件绑定。但ngModelChange在更新模型后会NgModel发出。{/ p>

如果您修改ngModel确实更新的值，则可能需要

constructor(private cdRef:ChangeDetectorRef) {}

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

否则ngModel可能保留旧值。

Angular 2选择（更改）事件，而不是更新下拉列表中的值

1 个答案: