时间戳

首页 > 解决方案 > 如何访问 ngOnChanges 字段？

html - 如何访问 ngOnChanges 字段？

问题描述

我的 HTML 看起来像这样：

<input type="number" class="form-control" id="khatianNumber" required [(ngModel)]="big.khatianNumberP1" name="khatianNumber" #khatianNumber="ngModel">

<p id="parapart" align="center">/</p>

<input type="number" class="form-control" id="khatianNumber2" required [(ngModel)]="big.khatianNumberP2" name="khatianNumber2" #khatianNumber1="ngModel">

我的 Angular 看起来像这样，

export class RegistrationComponent implements OnInit,OnChanges {
isRequesting = false;
steps = [];
model = {
  khatianNumber: '',
};

big = {
  khatianNumberP1: '',
  khatianNumberP2: '',
}
ngOnChanges(changes: SimpleChanges){
    if (changes['big.plotNumberP1']){
        alert("hi");
    }
}
}

我从来没有使用过这样的角度，我通常不得不使用范围和控制器。

有人可以告诉我我做错了什么吗？我的 HTML 有问题还是我使用的模型有误？我是 Angular 的新手，如果有人能解决这个疑问，我将不胜感激！

标签： htmlangular

解决方案

如果要在表单元素发生变化时运行动作，最好将[(ngModel)]="big.khatianNumberP1"和[ngModel]="big.khatianNumberP1"分开(ngModelChange)="numberP1Changed()"。

然后，在您的组件代码中，您可以有一个处理程序来执行您需要的任何操作：

export class RegistrationComponent {
    isRequesting = false;
    steps = [];
    model = {
        khatianNumber: '',
    };
    big = {
        khatianNumberP1: '',
        khatianNumberP2: '',
    }

    numberP1Changed() {
       alert("hi - new value - " + this.big.khatianNumberP1);
    }
}

推荐阅读