Contrôle manquant pour formControlName

Un formControlName du template pointe vers un contrôle que le FormGroup ne possède pas. La directive recherche le contrôle par son chemin et ne trouve rien.

Cela peut arriver lorsque le template et le groupe de formulaire sont construits à partir des mêmes données mais avec des filtres différents. Un élément est rendu dans le template mais n'a jamais reçu de contrôle dans le groupe de formulaire, si bien que son formControlName n'a rien à quoi se lier.

@Component({
  template: `
    <form [formGroup]="form">
      <ng-container formGroupName="options">
        @for (id of visibleIds; track id) {
          <input [formControlName]="id" />
        }
      </ng-container>
    </form>
  `,
})
class App {
  // The template renders an input for both ids...
  visibleIds = [1, 2];
  // ...but the form group only has a control for id 1.
  form = new FormGroup({
    options: new FormGroup({
      1: new FormControl(''),
    }),
  });
}

Déboguer l'erreur

Le message d'erreur liste les contrôles qui existent à ce niveau, par exemple :

Cannot find control with path: 'options -> 2'. Controls that do exist at this level: 1.

Comparez-le avec les noms auxquels votre template se lie. Ensuite, ajoutez le contrôle manquant au FormGroup, ou cessez de rendre le formControlName pour l'élément qui n'a pas de contrôle.