Question

我在ngOnInit()方法中创建了此表单：

this.cardForm = this.fb.group({
    card_number: ['', Validators.required],
    holderName: ['', Validators.required],
    expiry: ['', Validators.required],
    cvc: ['', Validators.required],
    address_line1: ['', Validators.required],
    address_line2: ['', Validators.required],
    address_city: ['', Validators.required],
    address_state: ['', Validators.required],
    address_zip: ['', Validators.required],
    address_country: ['', Validators.required]
  });

在我的模板上：

<form [formGroup]="cardForm" novalidate="novalidate">
  <div class="form-group">
    <label for="cardnumber">Card number</label>
    <input 
      type="text"
      name="cardnumber"
      class="input-transparent form-control"
      formControlName="card_number"
      data-mask="9999-9999-9999-9999"
      placeholder="____-____-____-____"
      required="required">
 </div>

然而，我收到了这个错误：

错误错误：无法找到名称为“card_number”
的控件

Answer 1

您的id代码中没有input。尝试插入

<input
    id="card_number"
   ...
>

更新1 如果你能提供更多可以提供帮助的代码。由于有一个Validators.required它应该有一个值。无论如何，只是一个预感尝试在输入中使用它。

[formControl]="cardForm.controls['card_number']"

而不是

formControlName="card_number"

Answer 2

致电：

 this.cardForm = this.fb.group({...)}

在构造函数中，而不是ngOnInit（）

未找到表单控件

2 个答案: