5

Q1。是否可以拥有一个控件,即:

ValidNumber = new Control('', CustomValidators.number({min:1, max:10}))

input验证模板中所有类似类型的字段?

Q2。这些字段可以由 生成ngFor吗?


FailedMethod 1:验证有效,但值是耦合的。

<input [ngFormControl]="ValidNumber" name="num1" type="number"/>
<input [ngFormControl]="ValidNumber" name="num2" type="number"/>

FailedMethod 2: formBuilder 同上。

<form [ngFormModel]="formBuiltWithFormBuilder">
  <input ngControl="ValidNumber" name="num1" type="number"/>
  <input ngControl="ValidNumber" name="num2" type="number"/>
</from>

客观说明:

  • 我正在尝试验证可能使用 ngFor 生成并需要类似验证的表单字段。

  • 无需在其他地方重复定义类似的控件。

  • 我可以使用任何其他方法(如#form="ngForm"or )提取的值ngModel,我想要的ngControl只是验证。

4

1 回答 1

3

您也可以生成控件然后没有问题。

@Component({
  ...
  template: `
...
<input *ngFor="let c in controls" [ngFormControl]="c" name="c.name" type="number"/>
...
`
})
class MyComponent {
  // initialization with `['a', 'b', 'c']` just for demo purposes
  // these values probably come from outside - hence @Input()
  @Input() controlNames:string[] = ['a', 'b', 'c']; 

  controls: Control[];

  ngOnInit() {
    this.controlNames.forEach(
        v => this.controls.push(
            new Control('', CustomValidators.number{min:1, max:10})
        )
    );
  }
}

(代码未测试)

controls更改时需要更新controlNamesngOnInit()只运行一次。

于 2016-02-26T13:15:12.253 回答