＃形式=“ngForm”和[ngFormModel] =“形式”之间的差异？

Question

两者有什么区别：

<form #form="ngForm">

和

<form [ngFormModel]="form">

当你使用一个比其他？

Answer 1

第一个策略是“模板驱动”的形式：角将一个隐含的指令添加到表格，你大多在声明模板添加验证，所以命名为“模板驱动的”。例如，这是如何添加一个验证器说，现场是必需的：

<form #form="ngForm">
    <input name="firstName" required [(ngModel)]="formModel">
</form>

在这里，我们使用了必需的属性，并通过隐指令角配置了必要的验证。这种类型的形式是非常非常适合于与NG-模型一起使用，并且理想的角1种形式迁移到角2。

第二种策略是“模型驱动的”形式。这里大家不要对模板声明验证，而不是我们声明控件的名称：

<form [formGroup]="form">
    <input name="firstName" formControlName="firstName">
</form>

然后，所有的验证逻辑是通过代码，而不是在模板声明。此外，我们可以订阅形式可观察到的，并使用功能性反应编程技术。例如：

@Component({
    selector: "some-component",
    templateUrl: 'model-driven-form.html'
})
export class ModelDrivenForm {
    form: FormGroup;
    firstName = new FormControl ("", Validators.required);
    constructor(fb: FormBuilder) {
        this.form = fb.group({
            "firstName":["", Validators.required]
        });
        this.form.valueChanges
        .subscribe((formValue) => {
            console.log(formValue);
        });
    }
}

这也适用于NgModel但正如我们看到就没有必要了，因为我们已经可以通过表单控件获得形式的价值。

因此，在两者之间选择很大程度上取决于使用情况：

• 如果迁移现有的形式，考虑NgModel +选项1
• 如果建立一个新的形式，想尝试官能团反应性的编程技术，考虑formGroup选项2
• 如前所述，NgModel作品也有选项2.所以，你可以通过NgModel结合通过代码定义的验证，并取得表单值。你不会被强迫使用formGroup官能团反应性的编程技术，但明确地给它一个尝试，它的功能非常强大

附：见Angular2 here更多的新形式

Answer 2

与第一种策略，可以定义表单在线控制。对于简单的验证，这种做法是不够的。隐式NgForm指令被施加到<form>元件。您可以使用局部变量要么引用HTML元素或特定指令适用于它。根据你的情况，这是一个指令。这样，那么你使用局部变量表达式：

<form #form="ngForm">
  <button type="submit" [disabled]="!ngForm.valid">Submit</button>
</form>

与其他一个你指的是使用在组件类FormBuilder类如下所述定义，控制：

export class DetailsComponent {
  constructor(builder:FormBuilder) {
    this.companyForm = builder.group({
      name: ['', Validators.required,  
         createUniqueNameValidator(service,this)],
      tags: ['', notEmptyValidator],
      addressStreet: ['', Validators.required],
      addressZipCode: ['', Validators.compose([ Validators.required, 
               zipCodeValidator ])],
      addressCity: ['', Validators.required]
    });
  }
}

第二种方法是更先进的，并允许注册自定义验证器，异步验证器和构成它们（见Validators.compose）为形式的元件。

希望它可以帮助你，蒂埃里