角度ui-form-validation不起作用

时间:2015-06-29 10:08:51

标签: angularjs angularjs-directive

尝试根据本教程https://www.youtube.com/watch?v=R-5loy9X6KE&feature=youtu.be和此github页面https://github.com/nelsonomuto/angular-ui-form-validation创建角度ui表单验证,但它似乎无法正常工作。

我的索引页

<html>

  <head>
    <script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script data-require="angular.js@1.2.10" data-semver="1.2.10" src="http://code.angularjs.org/1.2.10/angular.js"></script>
    <link href="style.css" rel="stylesheet" />
    <script src="angular-ui-form-validation.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-app="angularUiFormValidationApp">
   <form name="loginData" novalidate ng-controller="MainCtrl">
      <div class="list list-inset login-form">
          <i class="fa fa-users"></i>
          <input type="text" name="orgCode" class="form-control" ng-model="user.orgCode" placeholder="Organization Code" validation-no-space="true" validation-field-required="true" validation-no-special-chars="true" validation-dynamically-defined="locallyDefinedValidations">
          <br/><i class="fa fa-envelope"></i>
          <input type="email" name="email" class="form-control" ng-model="user.email" placeholder="Email Address" ng-required="true">
          <br/><i class="fa fa-lock"></i>
          <input type="Password" name="password" class="form-control" ng-model="user.password" placeholder="Your Password" validation-min-length="8" validation-field-required="true" validation-no-space="true" >
        <div class="login-btn">
          <button class="button button-block button-positive" type="submit">Log in</button>
        </div>
      </div>
    </form>
  </body>

</html>

我的脚本,js文件

angular.module('angularUiFormValidationApp', [
 'angularUiFormValidationApp', 'directives.customvalidation.customValidationTypes'
])

.controller('MainCtrl', function ($scope) {

  angular.extend($scope, {
      user: {
        orgCode: null,
        password: null,
        confirmPassword: null,
        email: null,
        firstName: null,
        lastName: null
      },
      locallyDefinedValidations: [                  
          {
              errorMessage: 'Cannot contain the number one',
              validator: function (errorMessageElement, val){
                  return /1/.test(val) !== true;    
              }
          },
          {
              errorMessage: 'Cannot contain the number two',
              validator: function (errorMessageElement, val){
                  return /2/.test(val) !== true;      
              } 
          }
      ]
  });
});

附件是我的plunkr文件 http://plnkr.co/edit/44i7Dp?p=info

0 个答案:

没有答案