使用角度7路由器,bootstarp4的表单验证不起作用

时间:2019-03-28 02:39:27

标签: bootstrap-4 angular7

<form class = "needs-validation" novalidate>

显示验证动画。第一个工作正常。 但是当我输入另一个路由器时,验证不起作用。

尝试输入“提交”按钮, 添加<form [formGroup] = "angForm"> 验证的结果是,即使未显示验证动画(绿色,红色),每个项目的值也可以很好地显示。

<form [formGroup]="angForm" (ngSubmit)="onSubmit()" class="needs-validation" 
 novalidate>
  <div class="form-group mb-3">
  <label for="validationCustom01">First name</label>
  <input type="text" formControlName="firstName" class="form-control is- 
 invalid" 
  id="validationCustom01" placeholder="First name" value="Mark" required>
  <div class="valid-feedback is-valid">
     Looks good!
  </div>
  </div>
  <button class="btn btn-primary">Submit form</button>
</form>
  angForm = new FormGroup({
    firstName: new FormControl('mark',[
      Validators.required
    ]),
    lastName: new FormControl(),
    userName: new FormControl(),
    city: new FormControl(),
    state: new FormControl(),
    zip: new FormControl()
 });

0 个答案:

没有答案