找不到名称为 <text input control name> 的控件

Question

我是 Angular 开发的新手，正在尝试创建一个包含 3 个文本用户输入的简单表单。

Error: Cannot find control with name: 'teamId'
    at _throwError (sources:///node_modules/@angular/forms/fesm2015/forms.js:2912:9)

HTML代码：

<form [formGroup]="profileForm">
            <label>
              Tab name:
              <input type="text" formControlName="tabName">
            </label>
          
            <label>
              Team Id:
              <input type="text" formControlName="teamId">
            </label>

            <label>
              Channel Id:
              <input type="text" formControlName="channelId">
            </label>

TS代码：

import { AfterViewInit, ChangeDetectorRef, Component } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { MatDialogRef } from '@angular/material/dialog';

export class MyComponent implements AfterViewInit{
    public profileForm: FormGroup;

    constructor(
        private readonly dialogRef: MatDialogRef<MyComponent>,
        private readonly changeDetector: ChangeDetectorRef,
    ) { 
        this.profileForm = new FormGroup({
            tabName: new FormControl(''),
            teamdId: new FormControl(''),
            channelId: new FormControl(''),
          });
    }

    ngAfterViewInit(): void {
        this.changeDetector.markForCheck();
    }

    public close() {
        this.dialogRef.close();
    }

我正在我的模块定义中导入 FormsModule, ReactiveFormsModule。

奇怪且对我来说没有任何意义的是，这仅针对 1 个文本 input-teamId（共 3 个）失败。其他 2 个成功。

我的代码中是否遗漏了什么？任何 help/leads 都会很有帮助。

谢谢。

Answer 1

您的 TS 代码中有错字。

在 TS 代码中你写了 teamdId 但在你的 html 中你写了 teamId

找不到名称为 <text input control name> 的控件

Cannot find control with name: <text input control name>

typescript

form-control

angular

formgroups