Angular 13 Reactive Form Validation Parser Error: Unexpected token [, expected identifier or keyword

Question

我正在尝试 Angular 使用响应式表单进行表单验证。我无法解决我面临的错误，有人可以帮忙吗？我的代码片段附在下面，

HTML:

<form [formGroup]="voucherDetailsForm">
        <div class="d-flex mt-1 form-group">
            <label class="col-md-5 col-form-label"> Project: </label>

            <ng-select class="col-md-7" id="project" 
            
            ngClass="{
                'form-control': true, 
                'is-invalid': !voucherDetailsForm.controls.project.valid && voucherDetailsForm.controls.project.touched, 
                'is-valid': voucherDetailsForm.controls.project.valid
            }" 
            
            [(ngModel)]="selectedProject" placeholder="-Select Project-"
                formControlName="project" (search)="onProjectSearch($event.term, 1,false)"
                (change)="onProjectChange($event)" bindLabel="text" (scrollToEnd)="onScrollProjectToEnd()">
                <ng-option *ngFor="let project of projectList" [value]="project">
                    {{project.projectRefCode}}-{{project.name}}
                </ng-option>
            </ng-select>
            <div *ngIf="voucherDetailsForm.['controls'].project.errors?.required">Project Required</div>
        </div>
    </form>

还有我的 Ts 代码：

this.voucherDetailsForm = this.formBuilder.group({
  project: [null, Validators.required]
})

Answer 1

 <div *ngIf="voucherDetailsForm.['controls'].pr ...

至

<div *ngIf="voucherDetailsForm['controls'].pr ...

Angular 13 Reactive Form Validation Parser Error: Unexpected token [, expected identifier or keyword

Angular 13 Reactive Form Validation Parser Error: Unexpected token [, expected identifier or keyword

validation

angular

angular-reactive-forms