• Angular2基础03:如何重置表单的验证状态?


    如何重置表单的验证状态?

    表单的使用是Web应用的核心,掌握表单的实时状态尤其重要,它们包括:

    1. 用户碰过此控件吗?

    2. 它的值变化了吗?

    3. 数据变得无效了吗?

    上述功能在angular2中通常使用 NgModel + 模板引用变量来搭配使用完成。

    根据上述状态,良好的显示隐藏错误信息/交互效果,能够带给用户好的体验。

    这里需要注意的是上述3个状态的变化理解:

    有效性:

    只要满足验证条件即为ng-valid,否侧ng-invalid

    是否被访问过:

    当鼠标focus该input(未移出时未ug-untouched),移出之后马上变为ng-touched(不管数据有无变化)

    当改变它Model层值时,也会变为ng-touched。

    控件值有无发生变化:

    当鼠标focus在该input上,并且输入时,马上由ng-pristine 变为 ng-dirty(实时变化)

    但是改变它Model层值时,ng-pristine并不会改变,这一点与 "是否被访问有所区别"

    需要记住的是:当用户更改数据后,为了让form组件保持为pristine,用户应该在点击按钮后,调用(#myForm="ngForm")myForm.reset().

  • 相关阅读:
    SQL应用初级指南
    XML 文档的基本操作
    SQL中单引号的转义
    C# (输入输出流)
    C# 文件与目录的基本操作(System.IO)
    数据库对象命名
    .Net 中的反射(反射特性) Part.3 (转载)
    C# 中的委托和事件(详解)
    SQL Server TransactSQL 编程
    Brush 色谱
  • 原文地址:https://www.cnblogs.com/noper/p/6411169.html
Copyright © 2020-2023  润新知