Angular Forms - 从 ValueChange 得到什么变化

Question

我正在使用 Angular 的反应式 Forms 并且我正在实施撤消/重做功能。

我想要的是将同一字段上的连续修改“打包”到一个单独的撤消操作中。 我认为为了实现这一点，我需要计算某种增量，也许使用差异库（如this ）。

让我用一个例子来解释一下：

• 用户将“姓名”字段更改为“汤姆”
• 用户选择“姓”字段为“猫”
• 用户将“姓名”字段更改为“杰瑞”，写得很慢或多次退出并进入该字段。
• 用户按下撤消。

我希望撤消操作恢复“名称”字段中的“汤姆”值，而不通过“Jerr”、“Jer”等值。

这是只能通过 Observable 转换附加到 form.valuechange 才能完成的事情，还是有一些更适合该任务的替代方法？

我没有任何代码要分享，因为目前我只是在研究如何实现该功能，所以请不要告诉我“告诉我们你得到了什么”的口头禅；）

谢谢！

Answer 1

您可以使用 rxjs 运营商去抖和成对实现，如

formControl=new FormControl('')

this.formControl.valueChanges.pipe(
    startWith(this.fromControl.value),
    debounceTime(500),
    pairwise())
    .subscribe(([old,value])=>{
      console.log(old,value)
    })

见stackblitz

或仅使用 debounceTime

this.formControl.valueChanges.pipe(
        debounceTime(500),
        .subscribe((res)=>{
          this.myLog.push(res)
        })