使用Angular.js验证表单输入的原始状态

The original state of using Angular.js to validate form input

本文关键字:原始 原始状 状态 输入 表单 Angular js 验证 使用      更新时间:2024-03-11

下面的代码是signin.html的一部分。当我访问该页面时,nick和password肯定是空的,所以myForm.nick.$error.required就是true。则显示错误消息。我想要的是,当我访问页面时,页面上没有错误消息。我该怎么办?感谢

<form ng-submit="signin()" name="myForm">
  <input type="text" name="nick" ng-model="data.nick" required>
  <span class="error" ng-show="myForm.nick.$error.required">Required</span><br>
  <input type="password" name="password" ng-model="data.password" required>
  <span class="error" ng-show="myForm.password.$error.required">Required</span><br>
</form>

您应该添加$dirty条件,以防止在页面开头显示所需的字段消息。

myForm.nick.$error.required && myForm.nick.$dirty
myForm.password.$error.required && myForm.password.$dirty

$dirty===true表示用户已经与表单进行了交互。

这是一个jsfiddle演示

希望这能有所帮助。