javascript Angularjs验证没有显示

时间:2017-10-17 13:32:10

标签: javascript angularjs angularjs-validation angularjs-controlleras

我正在使用ex6和angularjs,我写了一个angularjs验证表单。 HTML没有显示出来。它没有显示任何错误。

验证的HTML:

<form id="form" name="login.sign" class="setup info" novalidate>
    <div class="input-group login-max-width">
        <span class="input-group-addon" id="login-addon">
            <i class="fa fa-envelope" id="login-addon"></i>
        </span>
        <input id="login.credentials.email" type="email" class="form-control email validate valid"
            name="login.credentials.email" ng-model="login.credentials.email" placeholder="Email" required>
    </div><br />
    <div class="input-group">
        <span class="input-group-addon lock-fix">
            <i class="fa fa-lock"></i>
        </span>
        <input id="login.credentials.password" type="password" class="form-control password validate valid"
            name="login.credentials.password" ng-model="login.credentials.password" placeholder="Password" ng-minlength="6" required>
    </div>
    <center>
        <div class="input-group text-center" ng-show="login.error">
            <h3 class="error-show">{{login.error}}<i class="fa fa-exclamation-triangle"></i></h3>
        </div>
        <div class="form-group">
            <div class="row">
                <div class="col-md-4 login-flex-display">
                    <button type="submit" class="btn btn-success right-margin-button" ng-click="login.signIn(login.credentials)" 
                        ng-disabled="sign.credentials.password.$error.minlength || sign.credentials.password.$invalid || sign.credentials.email.$invalid">Login 
                    </button>
                    <button type="submit" class="btn btn-success" ng-click="login.signUp(login.credentials)" 
                        ng-disabled="sign.credentials.password.$error.minlength || sign.credentials.password.$invalid || sign.credentials.email.$invalid">Register
                    </button>
                </div>
            </div>
        </div>
    <div class="row">
        <div class="col-md-6">
            <h5 class="alert check-login white error-blue" ng-show="sign.credentials.email.$invalid">Email is not valid</h5>
        </div>
        <div class="col-md-6">
            <h5 class="alert check-login white error-blue" ng-show="sign.credentials.password.$error.minlength || sign.credentials.password.$invalid">Password must be atleast 6 digits</h5>
        </div>
    </div>
    </form>

routes.login.js:

import template from './login.html';
routes.$inject = ['$stateProvider'];
export default function routes($stateProvider) {
  $stateProvider
    .state('login', {
      url: '/Login',
      template: template,
      controller: 'LoginController',
      controllerAs: 'login'
    });
}

登录控制器:

    import {createUser} from '../../api/usersApi';

export default class LoginController {
  constructor($location, authentication) {
        this.location = $location;
        this.authentication = authentication;
        this.error = '';
    }
}


LoginController.$inject = ['$location', 'authentication'];

对于帮助人员来说。希望你知道如何解决它。 我认为它与“标志”和控制器名称“登录”有关 但我还是没弄明白。

1 个答案:

答案 0 :(得分:0)

尝试将ng-show =“login.error”更改为ng-show =“login.sign.error”将角度绑定到表单名称

我希望这对你有所帮助。