ngModel和输入的更改方法不起作用

Question

我有以下HTML模板

<input type="text" [(ngModel)]="mobile" (change)="mobileChanged()">

这是我的.ts

mobileChanged = () => {
    console.log(this.mobile);
};

在同一元素中包含ngModel和change是错误的吗？在我的情况下，我在输入中未调用mobileChanged。但是，当我检查mobile的值时，它会正确更新。

这是Angular 7。

Answer 1

当您失去输入字段的焦点时（例如：在字段外部单击），使用change将触发mobileChanged()。如果要在键入时触发mobileChanged()，请改用(ngModelChange)="mobileChanged($event)"。

Answer 2

我很高兴阅读本教程： https://blog.thoughtram.io/angular/2016/10/13/two-way-data-binding-in-angular-2.html 为了更好地理解双向数据绑定并掌握ngModel的使用。

正如使用ngModel所解释的那样，将表达式绑定到元素的input事件，所以它类似于：

<input [value]="mobile" (input)="mobile = $event.target.value">

您可以使用相同的方法来管理值的更新和日志。