输入未使用相同的FormControlName绑定到FormControls

Question

目前，我面临的问题是模板没有绑定到共享名称的formcontrols，删除了用于完整性检查的条件逻辑。

我试过的：拼写检查，不同的FormControl构造函数调用，删除条件逻辑以进行健全性检查。

TypeScript文件：

  @Input() repairForm: FormGroup;
  .
  .
  .
  ngOnInit() {
    this.isAuthorized = this.authService.isAuthorized;

    if(this.isAuthorized){
      this.repairForm.addControl('customerNumber', new FormControl('',))
      this.repairForm.addControl('originDate', new FormControl('',))
      this.repairForm.addControl('originTime', new FormControl('',))
      this.repairForm.addControl('originCity', new FormControl('Value Here',))
      this.repairForm.addControl('originState', new FormControl('',))
    }
    // other form code goes here
  }

模板文件：

<form [formGroup]="repairForm">
  .
  .
  .
  <div *ngIf="isAuthorized ">
    <div class="form-row">
      <mat-form-field>
        <input matInput formContolName="customerNumber" placeholder="Customer Number">
      </mat-form-field>
    </div>
    <div class="form-row">
      <mat-form-field>
        <input matInput formContolName="originCity" placeholder="Origin City">
      </mat-form-field>
      <mat-form-field>
        <input matInput formContolName="originState" placeholder="Origin State">
      </mat-form-field>
    </div>
    <div class="form-row">
      <mat-form-field >
        <input matInput [matDatepicker]="picker" formContolName="originDate" placeholder="Origin Date" (dateChange)="logEvent()">
        <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
        <mat-datepicker #picker></mat-datepicker>
      </mat-form-field>
      <mat-form-field>
        <input matInput formContolName="originTime" placeholder="Origin Time">
      </mat-form-field>
    </div>
  </div>
  .
  .
  .
</form>

加载表单时，与originCity关联的输入不显示“Value Here”。对输入的更改不会更改它们应与之关联的formControl。此外，datepicker dateChange事件中的日志事件记录修复表单的状态。更改任何这些字段后，表单将保持原始状态并且不受影响。最后，在类似情况下创建的其他字段也起作用。

Answer 1

更新，发现问题。在'formControlName'中输入一个拼写错误，只输入'formContolName'