单独添加没有值的 ngModel 属性的目的是什么？

Question

我正在看这个angular教程视频，我仍然很困惑为什么他只使用ngModel属性而不使用值，以及模板变量#firstName的目的是关于他使用的语法。使用这种语法时会发生什么?

这是YouTube视频

component.html

<form>
<div class="form-group">
<label for="firstName">First Name</label>
<input required ngModel name="firstName" #firstName="ngModel" class="form-control" (change)="log(firstName)">
</div>
<div class="form-group">
<label for="comment">Comment</label>
<textarea name="comment" id="comment" cols="30" rows="10" class="form-control"></textarea>
</div>
<button>Submit</button>
</form>

Answer 1

当我们使用模板引用变量时，Angular通常会理解变量"如果模板引用变量与组件相关，则为组件类型;如果模板引用变量位于html标签中，则为ElementRef或htmlElement。

如果我们的html标签有一个指令，Angular一般会理解它是指令的类型，否则一些元素是input，所以你可以使用(*)

#myVariable="directive"

现在，你可以在html中使用模板引用变量(在.ts中，你使用ViewChild获得它)和"指令"的所有属性。所以，在你的例子中，你可以使用，例如

{{firstName.valid}}

短暂:

1. 你说你的输入是"特殊的"，这不仅仅是一个输入具有ngModel
的属性的属性/方法该指令

(*)实际上不是指令，而是我们在指令

的exportAs中使用的名称。