当您在没有 [()] 语法的情况下使用 ngModel 指令时，它的支持属性是什么答案

【问题标题】：What is the backing property for ngModel directive when you use it without the [()] syntax当您在没有 [()] 语法的情况下使用 ngModel 指令时，它的支持属性是什么
【发布时间】：2017-12-05 18:56:06
【问题描述】：

查看我正在编辑的 Angular 表单示例，我看到一个示例使用 ngModel 关键字而不将其分配给支持属性名称。

<input ngModel required type="password" class="form-control" name="password" id="password" placeholder="Password" >

我通常看到它带有[ngModel]="password" 或[(ngModel)]="password" 的绑定括号

如果我们使用第一个示例的普通 ngModel 指令而没有赋值，输入数据绑定到什么支持属性？它是否不受任何约束，只能从form.values 访问？在什么用例中你想使用普通的 ngModel 指令 - 当你不需要绑定并且只想从表单值访问它时？

【问题讨论】：

标签： angular angular-forms

【解决方案1】：

我想到的一个用例是你不想将它绑定到一个字段，但你想在它发生变化时更新你的模型，比如

<input ngModel (ngModelChange)="updateModel($event)"

因为ngModelChange 不是匹配NgModel 指令的选择器，所以下面的代码不起作用

<input (ngModelChange)="updateModel($event)"

因此，您添加一个条形 ngModel 以应用 NgModel 指令并获取 ngModelChange 事件。

【讨论】：

【解决方案2】：

ngModel 在ngForm 指令中注册输入字段。输入的名称用作键。

一些组件.html

<form novalidate (ngSubmit)="save(form.value)" #form="ngForm" >
  <input type="text" name="title" ngModel />  
  <button type="submit" [disabled]="!form.valid">save</button>
</form>

一些组件.ts

...
save(value: any) {
   console.log(value.title);
}

如果您从输入字段中删除 ngModel，则 value.title 将消失（未定义）。

【讨论】：