Angular 角度<；选择>；绑定到对象确认更改或恢复到以前的值

我试图实现非常简单的

行为：如果用户取消了更改，则恢复到以前的值。事实上，我成功了，但这花费了我几个小时，我仍然对实现感到不满意，因为它不是那么明显和棘手

下面是模板：

全部的
{{state.name}

和组成部分：

导出类AppComponent{
selectedState:State=null；
州：州[]=[
{姓名：阿拉巴马州，人口：100000}，
{姓名：'阿拉斯加'，人口：50000}
];
onStateChange（先前的状态：状态，状态：状态）：void{
//如果我们把状态从“全部”改为“任何”，那没关系
如果（previousState==null）{
this.selectedState=状态；
返回；
}
//否则，我们希望用户确认该更改
如果（确认（'您确定要选择其他状态吗？'））{
this.selectedState=状态；
}否则{
//但不是仅仅“this.selectedState=previousState”`
//我需要继续下面的肮脏的黑客。
//步骤1：更改绑定到“[ngModel]”的属性值，
//对于任何，除了当前的，所以'null'是可以的
this.selectedState=null；
//步骤2：将此属性值还原为上一个属性值，
//可笑的是，它已经被设定为前一个，
//因为我们正在还原“this.selectedState”，
//同时传递完全相同的'this.selectedState'`
//将此方法作为“previousState”参数，
//所以我们实际上在做'this.selectedState=this.selectedState；`，
//但形式并不明显。
//这只能异步工作，
//调用堆栈清除后。
设置超时（（）=>{
this.selectedState=以前的状态；
}, 0);
}
}
}

我希望这些评论是不言自明的，至少我试着把它们写成这样

正如我在评论中已经提到的，simple

this.selectedState=previousState不起作用，并且省略了
setTimeout（）
。我也试过这个，但没有成功：

this.selectedState = previousState;
this.changeDetectorRef.detectChanges();

我的解决方案是基于，是的，我也看到了，但它不适合我，因为我将
绑定到一个对象，而不是标量值

演示：

软件包版本：

角度：6.0.0
似乎我找到了更优雅的解决方案，它基于。其思想是操作
的
所选索引。下面是模板：


陈述
全部的
{{state.name}

和组成部分：

onStateChange（先前状态：状态，状态：状态，状态选择：HTMLSelectElement）：void{
//如果我们把状态从“全部”改为“任何”，那没关系
如果（previousState==null）{
this.selectedState=状态；
返回；
}
//否则，我们希望用户确认该更改
如果（确认（'您确定要选择其他状态吗？'））{
this.selectedState=状态；
}否则{
statesEl.selectedIndex=this.states.indexOf（previousState）+1；
}
}

+1
是必需的，因为
null
不在
范围内。states
是states
的第一个

演示：
谢谢您的支持。无论出于何种原因，当还原到上一个选择时，我无法使用indexOf（previousState）+1方法，因此我向数组对象添加了一个Index属性。当重置selectedIndex时，我没有寻找索引，而是找到了以前选择的项并使用了它的literal Index属性；这帮助我克服了“+1”要求（以及代码无法工作的其他问题）。