对于 Angular 5 来说，触发自定义函数的最佳 ng-change/ngChange 事件是什么?

Question

我正在尝试让 ng-change 事件更新我通过这样做编写的函数。目前，该函数仅将"我在这里"记录到控制台。我像这样实现它：

<input type="number" ng-minlength="1" ng-maxlength="3" min="5" max="100" class="form-control" name="percentOwnership" (ng-change)="fullyOwned()"  [(ngModel)]="individualowner.percentOwnership">

我

试图取下单向绑定括号并添加双向绑定括号和括号，但没有任何触发我的函数将"我在这里"记录到控制台。

我也通过使用"change"和"ngModelChange"来尝试这些组合。尽管如此，没有什么能触发我的函数。我正在使用 Angular 5.2.9

Answer 1

您需要

分别使用 [ngModel] 和(ngModelChange)。

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: `
    <input type="number" [ngModel]="percent" (ngModelChange)="onPercentChange($event)" />
  `,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  percent = 20;
  onPercentChange(percent: number) {
    console.log('here');  
    this.percent = percent;
  }
}

现场演示

此外，您的min="5" max="100"验证将无法按预期工作。它们已在 Angular 4.2 中删除。阅读有关该问题的更多信息。