Question

我实现了一个子组件，用户可以在其中动态地向集合中添加或从集合中删除一组控件。该解决方案基于this SO question的答案。

它可以像魅力一样进行编译和工作，但是* ngFor指令上有一条令人讨厌的消息，内容是：

未定义标识符“节”。 '__type'不包含这样的成员Angular

我正在使用VS Code作为我的IDE。

我在* ngIf指令上看到类似的错误，并且在条件语句的开头添加双感叹号（!!）时，消息消失了，但是在这种情况下，该指令使用的是集合，而不是布尔值。

我如何让这种眼神消失？

HTML看起来像这样：

<div class="row" [formGroup]="saveForm">
  <label for="sections" class="col-md-3 col-form-label">Sections:</label>

  <div class="col-md-9">
      <a class="add-link" (click)="addSection()">Add Section</a>

      <div formArrayName="sections">
        <!-- The "problem" seems to be "saveForm.controls.sections" -->
        <div *ngFor="let section of saveForm.controls.sections.controls; let i=index" [formGroupName]="i">
          <label for="from">From:</label>
          <input class="form-control" type="text" formControlName="from">
          <label for="to">To:</label>
          <input class="form-control" type="text" formControlName="to">
        </div>
      </div>

    </div>

  </div>

这是组件：

import { FormGroup, FormBuilder, FormArray, ControlContainer } from '@angular/forms';
import { Component, OnInit, Input } from '@angular/core';
import { ISection } from '../shared/practice.model';

@Component({
  selector: '[formGroup] app-sections',
  templateUrl: './sections.component.html',
  styleUrls: ['./sections.component.scss']
})
export class SectionsComponent implements OnInit {
  @Input() sections: ISection[];
  saveForm: FormGroup;

  get sectionsArr(): FormArray {
    return this.saveForm.get('sections') as FormArray;
  }

  constructor(private formBuilder: FormBuilder, private controlContainer: ControlContainer) { }

  ngOnInit() {
    this.saveForm = this.controlContainer.control as FormGroup;
    this.saveForm.addControl('sections', this.formBuilder.array([this.initSections()]));

    this.sectionsArr.clear();

    this.sections.forEach(s => {
      this.sectionsArr.push(this.formBuilder.group({
        from: s.from,
        to: s.to
      }));
    });
  }

  initSections(): FormGroup {
    return this.formBuilder.group({
      from: [''],
      to: ['']
    });
  }

  addSection(): void {
    this.sectionsArr.push(this.initSections());
  }
}

Answer 1

结果发现Florian几乎正确了，正确的语法是：

<div *ngFor="let section of saveForm.get('sections')['controls']; let i=index" [formGroupName]="i">

这样，错误/警告就会消失，并且组件仍可以按预期工作。

ng由于错误'标识符未定义__type不包含此类成员'

1 个答案: