AngularJS-原始/脏污和触摸/未触摸之间的区别

AngularJS开发人员指南-表单告诉有关表单和字段的样式和指令很多。对于每个CSS类：

ng-valid
ng-invalid
ng-pristine
ng-dirty
ng-touched
ng-untouched

pristine/dirty和之间有什么区别touched/untouched？

AngularJS开发人员指南-AngularJS使用的CSS类

• @property {boolean} $ untouched如果控件尚未失去焦点，则为True。
• @property {boolean} $ touched如果控件失去焦点，则为True。
• @property {boolean} $ pristine如果用户尚未与控件交互，则为true。
• @property {boolean} $ dirty如果用户已经与控件进行交互，则为true。

$pristine/ $dirty告诉您用户是否实际更改了任何内容，$touched/ $untouched告诉您用户是否刚刚去过/访问过。

这对于验证确实有用。这样做的原因$dirty总是避免在用户实际访问某个控件之前显示验证响应。但是，仅使用$dirty属性，除非用户实际更改了值，否则用户不会获得验证反馈。因此，$invalid如果用户未更改/与值交互，则该字段仍不会向用户显示提示。如果用户完全忽略了必填字段，则一切正常。

使用Angular 1.3和ng-touched，您现在可以在用户模糊后立即在控件上设置特定样式，无论他们是否实际编辑了该值。

这是一个CodePen，显示了行为上的差异。

在Pro Angular-6中，该书的详细内容如下：

• valid：如果元素的内容有效，则此属性返回true，否则返回false。

• invalid：如果元素的内容无效，则此属性返回true，否则返回false。

• pristine：如果元素的内容未更改，则此属性返回true 。

• dirty：如果元素的内容已更改，则此属性返回true。
• untouched：如果用户尚未访问元素，则此属性返回true 。
• touched：如果用户访问过此元素，则此属性返回true 。

值得一提的是，表单和表单元素的验证属性不同 （请注意，接触和未接触仅适用于字段）：

Input fields have the following states:

$untouched The field has not been touched yet
$touched The field has been touched
$pristine The field has not been modified yet
$dirty The field has been modified
$invalid The field content is not valid
$valid The field content is valid

They are all properties of the input field, and are either true or false.

Forms have the following states:

$pristine No fields have been modified yet
$dirty One or more have been modified
$invalid The form content is not valid
$valid The form content is valid
$submitted The form is submitted

They are all properties of the form, and are either true or false.