javascript - ng-touched不起作用-AngularJS

表单字段未添加ng-touched类，而是保留为ng-pristine
这是我的表格:

<form novalidate class="css-form">

            <div class="form-group clearfix">
                <label class="col-xs-12 col-sm-6 col-md-4">State Code</label>
                <div class="col-xs-12 col-sm-6 col-md-8">
                    <input type="text" class="form-control" ng-maxlength="2" ng-model="ObjectNew.stateCode" required>
                </div>
            </div>
            <div class="clearfix"></div>

            <div class="form-group clearfix">
                <label class="col-xs-12 col-sm-6 col-md-4">Zip</label>
                <div class="col-xs-12 col-sm-6 col-md-8">
                    <input type="text" class="form-control" ng-model="ObjectNew.zip" required>
                </div>
            </div>
            <div class="clearfix"></div>

        </form>

当我在inspect元素中看到时，即使我同时浏览了两个字段并且将其保留为空，它也仅在每个字段上显示ng-pristine类。
它也显示ng-invalid，这很好。

必须实际添加样式:

.css-form input.ng-invalid.ng-touched {
    background-color: #FA787E !important;
    }

  .css-form input.ng-valid.ng-touched {
    background-color: #78FA89 !important;
  }

最佳答案

术语pristine和touched不相似。只要输入未被修改，输入将保留为pristine。只要不失去焦点，它就是untouched-Angular doc states当“控件已模糊”时应用ng-touched。

因此，输入可能是原始的且易于触摸的-只需单击它，然后单击其他位置而不输入任何内容即可。

它也有可能变脏且未被触摸-单击它，键入一些文本，但是不要单击其他任何位置。

要看到这一点，并查看实际的ng-touched，请引用此jsFiddle。

为确保其正常工作，请使用@dfsq指出的Angular 1.3。另外，请使用与您的Angular版本匹配的angular-touch。上面的JSFiddle可以正常工作。