typescript 角React形式-仅在对象的特定字段上应用验证器

gopyfrb3 于 2023-02-20 发布在 TypeScript

关注(0)|答案(1)|浏览(139)

我有一个带有表单数组的React式表单，当我初始化表单时，我在表单数组中使用默认值推送了一些表单控件。
下面是代码：

formValues?.tipsAndTricks?.forEach((tipAndTrick) => {
  this.tipsAndTricks.push(
    this.fb.control(
      { id: tipAndTrick.id, tip: tipAndTrick.tip },
      { validators: [Validators.required, Validators.minLength(25), Validators.maxLength(2000)], updateOn: 'change' }
    )
  )
})

问题是我的验证器不起作用，因为它们被应用于一个对象：

{ id: tipAndTrick.id, tip: tipAndTrick.tip }

我的问题是如何将这些验证器仅应用于该对象的tip字段？

typescript

来源：https://stackoverflow.com/questions/75479320/angular-reactive-form-apply-validators-only-on-specific-field-of-object

1条答案

按热度按时间

qxgroojn1#

您的FormArray包含对象，因此您应该使用this.fb.group()而不是FormControl推送FormGroup。
您可以使用以下命令将验证器添加到字段：

{ tip: ['value', [/* Validators */]] }

或

{ tip: this.fb.control('value', [/* Validators */]) }

完整代码应为：

formValues?.tipsAndTricks?.forEach((tipAndTrick) => {
  this.tipsAndTricks.push(
    this.fb.group(
      { 
        id: [tipAndTrick.id], 
        tip: [tipAndTrick.tip, [
          Validators.required, 
          Validators.minLength(25), 
          Validators.maxLength(2000)]
        ] 
      }
    )
  )
})

赞(0）回复(0）举报 2023-02-20

我来回答

typescript 角React形式-仅在对象的特定字段上应用验证器

1条答案

相关问题

热门标签

最新问答