Question

loginForm.$valid始终返回true，即使未填写必填字段也是如此。我无法在任何地方找到类似的问题。

<form name="loginForm" 
      class="form-login" 
      ng-submit="loginForm.$valid && loginCtrl.login(navCtrl)" 
      novalidate>

    <div class="form-group">
        <label for="email">Username:</label>
        <input type="email" class="form-control" id="username" placeholder="Enter username" required>
    </div>

    <div class="form-group">
        <label for="pwd">Password:</label>
        <input type="password" class="form-control" id="pwd" placeholder="Enter password" required>
    </div>

    <div class="form-group text-right">
        <a href="#">Forgot password?</a>
    </div>
    <div>Login form is {{loginForm.$valid}}</div>
    <button type="submit" class="btn btn-default">Login</button>
</form>

感谢任何帮助。

Answer 1

仅当您将ng-model个控制器分配给相应的控件时，才会设置表单验证和相关标志。因此，为它们分配ng-model指令。另外，您可以使用id而不是name。然后，它将用作formController实例上指定的相应ng-model控制器的别名（属性名称）（例如：loginForm.username.$valid）。

<div class="form-group">
        <label for="email">Username:</label>
        <input type="email" class="form-control" 
         ng-model="ctrl.userName"
         name="username" placeholder="Enter username" required>
    </div>

    <div class="form-group">
        <label for="pwd">Password:</label>
        <input type="password" class="form-control" 
           ng-model="ctrl.password"
           name="pwd" placeholder="Enter password" required>
    </div>

Answer 2

记住。

如果您使用的是棱角5材质设计，并在输入字段中使用[ngModelOptions] =“ {standalone：true}”，请将其设为false ==> [ngModelOptions] =“ {standalone：false}”

Answer 3

我也有这个问题。答案是required语法不存在。
因此，提交表格始终是有效的。

AngularJS表单验证始终如一

3 个答案: