[ngModel] 和 (ngModelChange) 如何协同工作？

我是 Angular 的新手，正在学习 Angular 6。我了解 ngModel。但当我尝试 ngModelChange 时，出现了一些问题。

我有一个 html 元素 超文本标记语言

<input #input  type="text" [value]="name" [(ngModel)] ="name" (ngModelChange) ="change(input.value)"/>

打字稿

change(event :any) {
    this.name = event;
    console.log(this.name);
}

更改 input 中的值后，我可以看到 name 属性的更改。

当我将 html 代码更改为

HTML

<input #input type="text" [value]="name"  [ngModel] ="name" 
(ngModelChange)="change(input.value)" />
{{ name }}

TS

change(event :any) {
    this.name = event;
    console.log(this.name);
}

它在控制台和用户界面中按预期工作正常。

问题1

<input #input  type="text" [value]="name" [(ngModel)] ="name" 
(ngModelChange) ="change(input.value)"/>

&

<input #input type="text" [value]="name"  [ngModel] ="name" 
(ngModelChange)="change(input.value)" />

是一样的吗？？

问题2。

当我删除 [ngModel] 指令时。 ngModelChange 没有被触发。是否必须拥有 [ngModel]？如果是，为什么？

HTML

<input #input type="text" [value]="name" 
(ngModelChange)="change(input.value)" />
<br/>
<br/>
{{ name }}

TS

change(event: any) {
     this.name = event;
     console.log(this.name);
 }

这将是一个很大的帮助。 提前致谢。

当元素具有名为 x 的可设置属性和名为 xChange 的相应事件时，[()] 语法很容易演示。这是适合此模式的 SizerComponent。它有一个 size value 属性和一个伴随的 sizeChange 事件

https://angular.io/guide/template-syntax#basics-of-two-way-binding https://angular.io/guide/template-syntax#basics-of-two-way-binding

所以，它们是等价的。

<input [(ngModel)]="name"/>
<input [ngModel]="name" (ngModelChange) ="name = $event"/>

但如果没有对应的属性，那么xChange不管用。

<input (ngModelChange) ="name = $event"/>