Angular 2中的AOT编译错误,用于访问formArray

时间:2017-09-07 05:52:28

标签: angular angular2-forms angular2-aot

这是我的formGroup

this.createOrderForm = this.fb.group({
      items: this.fb.array([])
    });

要在按钮上添加项目,请单击

 addItem() {
    const control = <FormArray>this.createOrderForm.controls['items'];
    const addrCtrl = this.initItem();
    control.push(addrCtrl);
  }

Item FormGroup是

initItem() {
    return this.fb.group({
      est_delivery_date: [''],
      est_delivery_time: [''],
      parentServices: ['', Validators.required],
      services: [''],
      brands: ['', Validators.required],
      sizes: ['',Validators.required],
      products: ['', Validators.required],
      discounts: [''],
      is_express_delivery: [''],
      is_packing: [''],
      confirmed: [''],
      coupon: ['']
    });
  }

在我的HTML中

<div class="panel panel-default margin-20">
          <h4 class="form-group col-xs-12">Items</h4>
          <div formArrayName="items">
            <div *ngFor="let item of createOrderForm.get('items').controls; let i=index" class="panel panel-default">
              <div class="panel-heading col-xs-12">
                <h5>Item {{i + 1}}</h5>
                <span class="ion-close pull-right" *ngIf="createOrderForm.get('items').controls.length > 1" (click)="removeItem(i)"></span>
              </div>
              <div class="panel-body" [formGroupName]="i">
                <createitem [pickup]="pickup_date" [group]="createOrderForm.get('items').controls[i]"></createitem>
              </div>
            </div>
          </div>
        </div>

我在 AOT 编译

时遇到错误

“AbstractControl”类型中不存在属性“控件”。

请帮我弄清楚为什么我会收到此错误,因为它在jit编译器中运行良好。

1 个答案:

答案 0 :(得分:1)

模板中的这一行是Aot编译问题的原因。

createOrderForm.get('items').controls

你需要这样做而不是

let item of createOrderForm.get('items').controls

有类似的东西

let item of getItem(createOrderForm)

组件中,使用以下

  getItem(form){
    return form.get('items').controls
  }