#var =" ngModel"的含义

时间:2017-05-16 21:59:48

标签: angular angular2-forms

我正在创建login.component.html,在此期间我创建了一个输入字段,然后将其绑定到email中找到的login.component.ts变量。最初我把它写成:

<input type="text" placeholder="Enter Email" id="email"
       [(ngModel)] = "email" name = "email" required #email="ngModel"/>

但在我将其更改为:

之前一直收到错误
<input type="text" placeholder="Enter Email" id="email"
       [(ngModel)] = "email" name = "email" required #em="ngModel"/>

#em="ngModel"到底发生了什么?为什么我只能使用难以置信的特定值?

2 个答案:

答案 0 :(得分:8)

您引用的语法在the form validation docs中提到,他们在那里解释:

  

模板变量(#name)的值为"ngModel"(总是如此   ngModel)。这为您提供了Angular NgModel的参考   与此控件关联的指令,您可以在其中使用   模板以检查控件状态,例如validdirty

问题是,您的email课程中有一个名为@Component的媒体资源,其模板中有一个名为email的{​​{3}}。你不能同时拥有这两者,因此你看到错误:

Error: Cannot assign to a reference or variable!

重命名属性或引用变量(在您的情况下,将后者更改为em)可以解决问题。您不仅限于“令人难以置信的特定值”,您可以更改为任何不属于属性的有效标识符。

答案 1 :(得分:0)

几天前我遇到了同样的问题,当我对其进行研发时,我发现了

 #var="ngModel" exports NgModel into a local variable called "var".

通过此操作,我们可以检查控制状态,例如有效被触摸