Angular 2表单元素＆＃39;属性 - 正确的语法？

Question

我正在阅读this artcle并在文章中看到：

  

<input type="search" [formControl]="seachControl">

和

  

<input type="text" formControlName="street">

我想知道说明formControl和formGroup的正确语法是什么。我可以做点什么吗

<input type="text" [formControlName]="street">

或

<input type="text" [attr.formControlName]="street">

或

<input type="text" [formControl]="street">？更具体地说，这三个实例有何不同？

Answer 1

[formControl]="seachControl"就是我们所说的模型绑定，它绑定到主表单元素，即搜索。

如果您有一个单独的表单元素，即search，您只需将其模型绑定到您在variable内创建的class内，并记住其类型你绑定的变量。

和

<input type="text" formControlName="street">

由于此street是在主formControl元素中创建的，因此您无法直接访问street变量。所以该指令正在做的是告诉该标记的主/父元素应该绑定到您在主street内创建的formControl。

至于

<input type="text" [formControlName]="street">

我不知道，但我认为formControlName实际上并没有进行绑定，而是告诉这个标签需要绑定的内容。并且语法表明它将尝试在类中查找街道变量绑定它。

你可以看到他说的话。

  

这是formControlName指令发挥作用的地方。它几乎相当于模板驱动表单中的ngModel和name属性组合。每个表单控件都会应用formControlName指令，因此我们可以在 外部表单

上注册控件

所以你只需要绑定外部模型，因为在class中存在/实例化formControlName和formGroupName将会处理内部元素。