Angular 2 RC-4 表单，类型 'FormGroup' 不可分配给类型 'typeof FormGroup'

Question

我在使用 Angular 2 表单时遇到了一些问题，我在我的项目中成功地实现了一些表单，当我尝试添加这个表单时，我的 Angular Cli 出现了错误:类型“FormGroup”不可分配给类型“typeof FormGroup”。

有人遇到过这个吗？

这是我的组件代码:

import { Component } from '@angular/core';
import {AngularFire} from "angularfire2/angularfire2";

import {DataService} from "../../shared/data.service";
import {FormGroup, FormBuilder, Validators} from "@angular/forms";

@Component({
  moduleId: module.id,
  selector: 'tm-address-book',
  templateUrl: 'address-book.component.html',
  styleUrls: ['address-book.component.css'],
  providers: [DataService]
})
export class AddressBookComponent {
  myAddressForm = FormGroup;
  addressbook: Array<any>;

  constructor(private af: AngularFire,
          private formBuilder: FormBuilder,
          private dataService: DataService) {
  af.database.list('Addressbook').subscribe(address => {
    this.addressbook = address;
    console.log(this.addressbook);
  });

  this.myAddressForm = formBuilder.group({
    'companyName': ['', Validators.required],
    'street': ['', Validators.required],
    'city': ['', Validators.required],
    'postCode': ['', Validators.required],
  })
}

这是 html 表单代码:

<form [formGroup]="myAddressForm" (ngSubmit)="onSubmit()">
            <div class="form-group">
              <input type="text" class="form-control" formControlName="companyName" name="companyName" placeholder="Nazwa firmy">
            </div>
            <div class="form-group">
              <input type="text" class="form-control" formControlName="street" placeholder="Ulica">
            </div>
            <div class="form-group">
              <input type="text" class="form-control" formControlName="city" name="city" placeholder="Miejscowość">
            </div>
            <div class="form-group">
              <input type="text" class="form-control" formControlName="postCode" name="postCode" placeholder="Kod pocztowy">
            </div>
            <button type="submit" class="btn btn-success waves-effect waves-light" data-toggle="collapse" data-target="#collapse1">
              Dodaj
            </button>
          </form>

Answer 1

我猜你用 : 弄乱了 =。

将您的 myAdressForm 定义更改为:

export class AddressBookComponent {

   myAddressForm : FormGroup;
   ...
}

您键入它的方式 (myAdressForm = FormGroup)，会将属性 myAdressForm 分配给 FormGroup 的类类型