Question

我遗漏了一些简单的东西，我确信它，但我的表单验证消息永远不会出现在下面的代码中。

<form name="loginform"  ng-controller="controllers.LoginController"  ng-submit="loginUser(loginform.$valid)" novalidate>
        <fieldset>
          <br/>
            <legend><h3>Account Login</h3></legend>

            <div class="{ 'has-error' : loginform.username.$invalid && !loginform.username.$pristine }">
                <label>Username:</label>
                 <input type="text" ng-model="username" name="username" placeholder="username"  class="form-control"   required><span   ng-show="loginform.username.$invalid && !loginform.username.$pristine" class="help-block">Required!</span>

            </div>
      <br/>         
            <div class="{ 'has-error' : loginform.password.$invalid && !loginform.password.$pristine }">
            <label>Password:</label> 
                <input type="password" name="password" ng-model="password" placeholder="password" class="form-control"  required><span   ng-show="loginform.password.$invalid && !loginform.password.$pristine" class="help-block">Required!</span>
            </div>


             <div class="form-group">
               <button type="submit" class="btn btn-primary" >Submit</button>

                 <a href="#" class="advanced-search-button submit-button" ng-disabled='!loginform.$valid' ng-click="loginUser(loginform.$valid)">Login</a>
            </div>


        </fieldset>
    </form>


controllers.LoginController = function ($scope, $location, AuthFactory, Page) {
'use strict';


$scope.username = null;
$scope.password = null;


$scope.loginUser = function (isValid) {

Answer 1

$ pristine check是问题......以下是更正......

 <form name="loginform"  ng-submit="loginUser(loginform.$valid)" novalidate>
        <fieldset>
          <br/>
            <legend><h3>Account Login</h3></legend>

            <div class="form-group" ng-class="{ 'has-error' : loginform.password.$invalid && submitted }">
                <label>Username:</label>
                 <input type="text" ng-model="username" name="username" placeholder="username"  class="form-control" ng-required="true"   required><span   ng-show="loginform.username.$invalid && submitted" class="help-block">Required!</span>

            </div>
      <br/>         
            <div class="form-group" ng-class="{ 'has-error' : loginform.password.$invalid && submitted }">
            <label>Password:</label> 
                <input type="password" name="password" ng-model="password" placeholder="password" class="form-control"  required><span   ng-show="loginform.password.$invalid && submitted" class="help-block">Required!</span>
            </div>


             <div class="form-group">
               <button type="submit" class="btn btn-primary" >Submit</button>

                 <a href="#" class="advanced-search-button submit-button" ng-disabled='!loginform.$valid' ng-click="loginUser(loginform.$valid)">Login</a>
            </div>


        </fieldset>
    </form>

Angular表单验证消息未出现

1 个答案: