Question

我知道我们可以使用@Input和onChange钩子来检测子组件中父组件中所做的更改。但我的用例是检测在同一组件内对模型所做的更改。 component.ts：

export class MyComponent implements OnInit {

    private myExmapleModel: MyModel;

    ngOnInit: void {
           this.momyExmapleModeldel = new MyModel('', '', '');
    }

}

我将myExampleModel双向绑定到模板html，并希望在MyModel实例中的值在同一个MyComponent中更改时触发函数。我怎么能这样做？

Answer 1

如果您在html中使用myExmapleModel，请执行以下操作：

<input ([ngModel])="myExmapleModel">

您可以像这样使用ngModelChange回调：

<input [ngModel]="myExmapleModel" (ngModelChange)="onChange($event)"

Answer 2

如果你想检测输入的变化，使用输入事件或想要检测焦点的变化，即光标不在输入框中，请使用change-event

<input [(ngModel)]="name" (input)="changed()" />

<input [(ngModel)]="name" (change)="changed()" />

changed() {
  console.log('name changed')
}

检测同一组件内模型的更改 - Angular

2 个答案: