Angular 当输入类型为Number时，会在模糊时触发ValueChanges

我很惊讶地发现，与其他类型的HTML输入不同，在数字类型的输入中键入会在模糊时触发

valueChanges

，单击微调器（旁边的小箭头）会触发两次

valueChanges

，这是预期的行为吗？我错过什么了吗

组件：

导出类AppComponent{
textControl=newformcontrol（）；
numberControl=新表单控件（）；
ngOnInit（）：void{
this.textControl.valueChanges.subscribe（console.log）
this.numberControl.valueChanges.subscribe（console.log）
}
}

模板：

这是Stackblitz

这是已经在Angular 10中修复的

在此修复之前：

从Angular 10开始，它只监听一个：

host: {
     '(input)': 'onChange($event.target.value)'

---

看起来这在Angular的某些版本中是个问题。 也有人在Github上报告了同样的问题

只要@alon的演示正常，它看起来就固定在角度10

我相信这对你来说不是一个关键问题

然而，一个简单的解决方案是使用

distinctunitrichanged

操作符

this.numberControl.valueChanges
  .pipe(distinctUntilChanged())
  .subscribe(console.log)

---

也许我不明白你的意思，但是这个stackblitz，正好有你的代码和值Changes正在按预期登录change/keydown尝试按number类型输入中的任何数字，然后在该输入之外单击，您将看到该值已写入控制台twiceit's not because in@alou'sstackblitz@alou让我们看看我在回答中发布的演示哦，这真的发生了。你的解决方案很棒，但是当输入嵌套在一个有更多控件的groupForm中时，它会变得更复杂，您必须在

distinctUntilChanged

this.numberControl.valueChanges
  .pipe(distinctUntilChanged())
  .subscribe(console.log)