Angular 2选择（更改）事件，不更新下拉菜单中的值

当选择下拉更改时，我调用(change)指令的方法来检查是否允许选择的值，如果不允许选择的值，则选择再次返回上一个值（还原下拉菜单中的更改），但下拉菜单中的选定值仍显示新的选定值，但ngModel变量是以前的值，例如：Angular 2选择（更改）事件，不更新下拉菜单中的值

我选择改变从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。

任何帮助将不胜感激

来源

2017-01-17 deanwilliammills

使用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可能保持旧值。

来源

2017-01-17 09:51:59

我已经尝试过了，但仍然没有更新HTML中的选择值和'（ngModelChange）'我不会知道新选定的值是什么 – deanwilliammills

对不起，我不明白你的意思是“I将不知道新选定的值是什么“。当调用ngModelChange（）时，新选定的值已经分配给'this.test'。你也可以像'（ngModelChange）=“doCheck（$ event）”' –

那样显式传递它，当'（ngModelChange）'在'[（ngModel）]'前面时，'[（ngModel）]'只在调用'（ngModelChange）'。所以我在'（ngModelChange）'前面移动了[[（ngModel）]'，然后在调用'（ngModelChange）'前调用'[（ngModel）]'，但仍然显示** B **和不** A **，虽然'this.test'是1 – deanwilliammills

Angular 2选择（更改）事件，不更新下拉菜单中的值

回答

相关问题