角度动态嵌套数组不显示错误

问题描述

我有以下嵌套数组工作完美，除了第二级和第三级不会显示来自验证器的错误消息。我认为它与返回值有关，因此它会返回对象而不显示“空”错误。任何帮助表示赞赏。

component.ts

constructor(
    public formBuilder: FormBuilder,private router: Router,private ngzone: ngzone,private crudService: CrudService
  ) { 
    this.portfolioForm = this.formBuilder.group({
      program_title: ['',Validators.required],...
    })
  }
  
addProject() {
    let control = <FormArray>this.portfolioForm.controls.projects;
    control.push(
      this.formBuilder.group({
        project_title: ['',...
      })
    )
  }

component.html

<form [formGroup]="portfolioForm" (ngSubmit)="onSubmit()">
  <div class="row pl-3 pr-3">
    <div class="col-7 card-body widget-body">
      <div class="form-group">
        <label for="textarea">Program Title</label>
        <input type="text" class="form-control form-control-sm checking-field" formControlName="program_title" required>
        <span class="help-block text-danger" *ngIf="portfolioForm.get('program_title').touched && portfolioForm.get('program_title').hasError('required')">Title is required</span>                              
                    

...

  <div formArrayName="projects">
    <div *ngFor="let project of portfolioForm.get('projects')['controls']; let i=index">
      <fieldset>
        <div [formGroupName]="i">
          <div class="row pl-3 pr-3">
            <div class="col-1 card-body"></div>
              <div class="col-6 card-body">
                <div class="form-group">
                  <label for="textarea">Project {{i+1}} Title</label>
                  <input type="text" class="form-control form-control-sm checking-field" formControlName="project_title" required>
                  <span class="help-block text-danger" *ngIf="portfolioForm.get('project_title') && portfolioForm.get('project_title').touched && portfolioForm.get('project_title').hasError('required')">Title is required</span>                              

解决方法

添加这个方法动态检查，并插入到你的标题中*ngIf

subProjectTitleError(form: FormGroup,i: number,j: number): boolean {     return form.dirty && this.portfolioForm.get('projects').get(String(i)).get('subprojects').get(String(j)).get('subproject_title').value === ''   }