Question

我需要帮助，我的表格很长。并且当客户点击提交时，它需要显示未填写的字段。

模板：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<form>
 <input type="text" ng-model="obj.firstName" name="firstName">
  <input type="submit" value="Submit" ng-click="submitForm(obj)"/>
</form>
</div>

组件：

    <div class="container"  [formGroup]="ClientForm">
    <div class="form-group" [ngClass]="{'has-success':ClientForm.controls.input1.valid,'has-danger':!ClientForm.controls.input1.valid}">
    <label>Input 1</label>
    <input type="text" class="form-control" placeholder="Input 1" readonly formControlName="input1">
    <small class="form-text text-muted" [hidden]="ClientForm.controls.input1.valid">This field is required!</small>
  </div>
  <hr>
  <button type="submit" (click)="onSubmit(ClientForm)" class="btn btn-primary">Submit</button>    Status: {{ClientForm.status}}
  </div>

https://plnkr.co/edit/x5q7sVucARspL8bIITdQ?p=preview

你能帮助我吗？

Answer 1

简单快速的解决方案，只需在您的字段中添加required，如下所示：

<input type="text" class="form-control" placeholder="Input 2" formControlName="input2" required>

该消息将显示在浏览器中，从第一个空字段开始。

这是你想要的那种解决方案吗？

您的Plunker

如果我把一个错误的字段转到该字段怎么办（锚类型）

1 个答案: