Angular 选择不从双向绑定获取值的控件

我有以下选择控件：

可用
不可用的

我正在使用一个名为

available

的属性的双向绑定。我希望用户能够设置可用/不可用状态，后端方法将调用API，如果失败，将显示错误消息并将select控件设置回以前的状态

为了测试这一点，我做了以下组件：

import { TextAttribute } from "@angular/compiler/src/render3/r3_ast";
import { Component, OnInit } from "@angular/core";

@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent implements OnInit {
  available: boolean;
  ngOnInit(): void {
    this.available = false;
  }

  async handleChange(event: Event) {
    // ... some process to set status
    //oops error happened setting status, lets set it back
    this.available = false;
    console.log(event);
  }
}

堆栈闪电战：

我期望发生的是，用户选择available，然后立即将其设置为unavailable，但实际情况是设置

available

属性不会更改下拉列表

---

我对角度绑定的错误理解是什么？

原因是

handleChange

中可用的

值发生了变化，但在
变化检测
周期之后，这就足够使用
设置超时了

async handleChange(event: Event) {
  // ... some process to set status
  //oops error happened setting status, lets set it back
  setTimeout(() => {
    this.available = false;
    console.log(event);
  }, 0)
}

非常感谢。是否有我可以使用的承诺或订阅？正如您所说，如果您在
handleChange
函数中发出http请求，并在observer中更改
可用的
，它将自动更新您的视图，而无需使用
setTimeout
（对于测试，您可以使用一些伪造请求
间隔（1000）.管道（first（））
）因为
ngZone
猴子修补了可观察物。