当值从组件 Angular 2/5 绑定时如何在 ngModel 上进行监视？

Question

我有估算文本框。当我更改其他文本框的值时，估计文本框的值正在更新。

我还需要手动更改“估计”文本框的值。所以我想在 Estimate 文本框上放一些手表，这样每当它的值发生变化时，我就可以应用一些自定义代码。

这是我试过的代码：

import { Component, Input, OnChanges, OnInit, SimpleChanges, IterableDiffers, DoCheck } from '@angular/core'; 

constructor(differs: IterableDiffers) { 
      this.differ = differs.find([]).create(null); 
} 

ngDoCheck() { 
      const change = this.differ.diff([this.estimateValue]); 
}

我收到以下错误：

简而言之，我想在 AngularJS 中做与 $watch 完全一样的事情。

有人可以帮忙如何在 Angular 5 中完成吗？

TIA！

Answer 1

尝试使用表单。在你的 component.ts :

yourForm : FormGroup;
constructor(private formBuilder: FormBuilder,) {

this.yourForm = this.formBuilder.group({
   textBox: [''], 
});
}
ngOnInit(){

    this.yourForm.controls['textBox'].valueChanges.subscribe((val) => {
         //Do whatever you want with your val
    });    
}

在你的 Html 中：

<form [formGroup]="yourForm">
   <div>
     <input type="text" class="form-control" name="exemple" formControlName="textBox">
   </div>
</form>

现在，只要您的 textBox 值发生变化，它就会触发一个事件，该事件的值是订阅内的字段值 "val"。

当值从组件 Angular 2/5 绑定时如何在 ngModel 上进行监视？

How to do watch on ngModel when value binds from component Angular 2/5?

angular

watch