Javascript 动态场的角度7形式验证

我的表单包含2个复选框，如果我选择其中一个复选框，它将填充一个文本框（子问题）。在我的场景中，我有两个复选框、两个文本框和一个提交按钮。这两个文本框都是必填字段

如果用户提交表单时未输入文本框，则应显示错误消息

让我们假设

用户选择第一个复选框，因此文本框1将填充。然后用户 填充textbox1并点击submit按钮，表单可以正常提交

在我的场景中

用户在提交表单后选择第二个复选框，因此 子问题带有错误消息。但我期待第二次 文本框错误消息应在再次点击提交按钮后出现

---

为了更好地理解，请参见中的示例。

它显示消息是因为表单已经提交，并且基于html条件，它在提交之前显示错误消息

提交表单后，您可以使用

ViewChild

访问角度表单的

submit

属性，并将其设置为

false

。希望这能解决你的问题

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

  title = 'InputDirective';

  checkbox_a:boolean;
  checkbox_b:boolean;
  textbox1:string;
  textbox2:string;
  @ViewChild("angularForm", {static: false}) public angularForm: any;

  onSubmit() {
    alert('form submitted success..');
    this.angularForm.submitted = false;
  }

}

---

Stacblitz链接-->

请提出明确的问题。不清楚您在问什么。请在stackblitz 1中尝试以下步骤。选择第一个复选框，然后填充文本框并点击submitt按钮。再次选中第二个复选框，则文本框将显示错误消息，但我不希望在呈现文本框时显示该错误消息。如果用户第二次点击提交按钮而未输入文本框，则只会显示错误消息