在Angular中怎么監(jiān)聽某個(gè)值的變化

今天小編給大家分享一下在Angular中怎么監(jiān)聽某個(gè)值的變化的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。

Angular監(jiān)聽某個(gè)值的變化

使用getter

在 Angular 中可以用 getter 來監(jiān)聽某個(gè)值的變化，類似于 Vue 中的 watch

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  _inputVal;

  set inputVal(val) {
    this._inputVal = val;
    this.inputChange();
  };

  get inputVal() {
    return this._inputVal;
  }

  inputChange(val) {
    console.log(val);
  }
}

angular使用form表單監(jiān)聽數(shù)據(jù)

主要使用方法類 FormGroup，F(xiàn)ormBuilder，Validators

引入主要使用方法類 FormGroup，F(xiàn)ormBuilder，Validators

import {
 Validators,
 FormGroup,
 FormBuilder
} from '@angular/forms';

賦值引入

    validateForm: FormGroup;
    constructor(private fb: FormBuilder,private ref: ChangeDetectorRef,private private) {}

創(chuàng)建表單+監(jiān)聽數(shù)據(jù)

  data = {
      name: [null, [Validators.required]], //Validators.required 表示驗(yàn)證（必填）
  };
  ngOnInit(): void {
    this.validateForm = this.fb.group(this.data);
    // 監(jiān)聽整個(gè)表單的變化
    this.validateForm.valueChanges.subscribe(data => console.log('form', data));
    // 單個(gè)control 變化
    this.validateForm.get('name').valueChanges.subscribe(data => console.log('solo', data));
  }

以上就是“在Angular中怎么監(jiān)聽某個(gè)值的變化”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。