如何在 Angular 中检查表单字段是否被触摸且为空

Question

如果表单字段被触摸并留空，我想警告用户。我可以检查空白字段是否被 触摸$pristine。但如果我从 预加载表单数据$scope，则$pristine不起作用。另外，我不想使用required参数，我只想注入警告样式ng-class。

<div ng-class="{'has-warning': !form.name.$pristine}">
  <input type="text" name="name" ng-model="people.name">
</div>

Answer 1

此处描述的 ngModel 上设置了多个状态属性。您可能需要考虑使用 form.name.$dirty 或 form.name.$touched 代替。

编辑

尝试使用：

ng-class="{'has-warning': form.name.$touched && people.name.length === 0}"

Answer 2

您可以尝试使用 ngFocus：

指定焦点事件的自定义行为。

https://docs.angularjs.org/api/ng/directive/ngFocus

<div ng-class="{'has-warning': !form.name.isValid}">
  <input type="text" name="name" ng-model="people.name" ng-focus="form.name.isValid = people.name ? true : false">
</div>