Angular FormControl验证器有时不工作，但在不应该工作的地方工作'；t其他

我正在Angular中创建一个反应式表单，它涉及到用户输入任意数量的零件请求，这些零件显示为输入行

对于每个零件，都需要某些字段，有些字段只能是数字。我已经包含了用于此的验证器，但无论发生什么情况，输入都不会显示为无效。我在部件之外有验证器，这些验证器工作正常，输入为空时显示错误

在另一端，我有一个可选的“Notes”字段，没有验证器，就像它有

验证器一样。必需的
，当为空时无效

是不是我做错了什么导致了这些问题？我试着寻找解决办法，但到目前为止运气不好


create.component.html

interface.ts（PurReqPart）

您的
addRow（）
函数是什么？
我认为，您还需要在那里显式显示验证器。
詹姆斯，恐怕formBuilder方法不会“解构”参数，因此您不能这样做

//this NOT work
const obj=['',[Validators.maxLength(10)]]
this.control=this.formBuilder.control(obj)

所以你不能做你想做的事。你可以做一个函数，比如

getPurReqPart(data:any=null)
{
   data=data || {quantity:0,unit:''...}
   return formBuilder.group({
      quantity:[data.quantity,[Validators.required,Validators.pattern(this.numbersOnlyRegEx)],
      ...
   })
}

但不是在接口中。Angular没有一些类似ASP.NET的
DataAnotations
，我想你正在尝试一些类似的-
我想更改
界面中的
：
s。ts
为
=
s，但这没有改变任何东西欢迎来到表单和表单控件的恐怖！我做了一个为期7个月的表单控制系列，得出结论，使用NgModel是非常优越的。这是我写的一篇文章：@JohnPeters，不是，真的不是，也许没有人能恰当地解释反应形式。（实际上，有两种方法可以创建表单组-使用FormBuilder或直接不起作用-），但只有验证器才能确保反应式表单的价值。另一个有趣的能力是，在提交或模糊时，可以通过强大的可观察性订阅valueChange，或者不检查其他内容。当然，你需要一个新的方法来改变被动形式。事实上，你已经偏离了底线，我花了7个月的时间研究被动形式的谬误，得出结论，ngModel可能要高得多。在那篇文章中，我展示了如何在模型和视图之间保持更改的同步。只需要三行html代码就可以做到这一点。与上面所示相比，这有多容易。此外，在html no in code behind中仍然可以进行验证。@JohnPeters，在每次更改时创建一个调用api的控件（但您需要一个debounceTime），或者验证一个与另一个控件不相等的控件，或者创建一个asyncValidation并指示该控件正在等待验证。。。我无法想象如果没有反应形式，如何制作一些东西。顺便说一下，检查一下，沃德·贝尔的评论-更接近你的观点-或者这样
addRow（）
将另一个
PurReqPart
对象推到
parts
数组中，验证程序包含在
PurReqPart
的构造函数中，谢谢！这解决了部件验证程序无法正常工作的问题，我不知道formBuilder不会分解其参数。不幸的是，我仍然不明白为什么我的“注释”部分在没有验证器的情况下仍然是必需的。
import { Validators } from "@angular/forms";

export class PurReqPart {
  numbersOnlyRegEx = '^[0-9]*$';
  constructor(
    public quantity?,
    public unit?,
    public supplierPN?,
    public description?,
    public unitCost?
  ) {
    quantity: [quantity, [
      Validators.required,
      Validators.pattern(this.numbersOnlyRegEx)
    ]];
    unit: [unit, [
      Validators.required
    ]];
    supplierPN: [supplierPN, []];
    description: [description, []];
    unitCost: [unitCost, [
      Validators.required
    ]];
  }
}

//this NOT work
const obj=['',[Validators.maxLength(10)]]
this.control=this.formBuilder.control(obj)

getPurReqPart(data:any=null)
{
   data=data || {quantity:0,unit:''...}
   return formBuilder.group({
      quantity:[data.quantity,[Validators.required,Validators.pattern(this.numbersOnlyRegEx)],
      ...
   })
}