无法读取undefined属性'dirty'

Posted 2023-02-28

我在shared.module.ts中为show for error创建了一个组件。

<span *ngIf="fieldErrors(fieldName)">
<div class="alert alert-danger mt-1" role="alert" *ngIf="fieldErrors(fieldName).required">
    پر کردن   nicename  اجباری است
</div>
<div class="alert alert-danger mt-1" role="alert" *ngIf="fieldErrors(fieldName).touched">
    پر کردن   nicename  اجباری است
</div>
<div class="alert alert-danger mt-1" role="alert" *ngIf="fieldErrors(fieldName).pattern">
    باید از کارکتر های فارسی استفاده شود
</div>
<div class="alert alert-danger mt-1" role="alert" *ngIf="fieldErrors(fieldName).minlength">
    تعداد کارکتر های مورد استفاده باید بیشتر از fieldErrors(fieldName).minlength.requiredLength باشد
</div>

TS

    export class FilderrorComponent implements OnInit 

  @Input("form") from:FormGroup
  @Input("field") fieldName:string;
  @Input("nicename") nicename:string;
  constructor()  

  ngOnInit() 
  

  fieldErrors(field:string)
    let controlState=this.from.controls[field];
    return (controlState.dirty || controlState.touched) ? controlState.errors:null;
  

我在html文件中使用它：

 <form [formGroup]="addCatFG" >
    <div class="form-row">
      <div class="form-group col-md-6">
        <label for="inputEmail4">نام دسته</label>
        <input type="email" class="form-control" id="inputEmail4" formControlName="name">
        <app-filderror [form]="addCatFG" fieldName="name" nicename="نام دسته"></app-filderror>
      </div>
      <div class="form-group col-md-6">
        <label for="inputState">زیر دسته</label>
        <select id="inputState" class="form-control" formControlName="parentId">
          <option selected>دسته مورد نظر را انتخاب کنید</option>
          <option>دسته اصلی</option>
        </select>
        <app-filderror form="addCatFG" field="parentId" nicename="زیر دسته"></app-filderror>
      </div>
    </div>
  </form>

这是TS

      InitialForm()
  
    this.addCatFG=this.fb.group(
      name:['',Validators.compose([Validators.required])],
      parentId:['',Validators.compose([Validators.required])]
    )
  

但当页面加载时显示此错误：

无法读取undefined属性'dirty'

和this is my sample code

有什么问题 ？我怎么解决这个问题 ？

答案

您定义了@Input("field") fieldName:string;，这意味着输入属性field将映射到变量fieldName。但你使用fieldName="family"作为任务。改为field="family"。

<app-filederror [form]="addCatFG"  field="family" nicename="family"></app-filederror>