错误消息不适用于较新版本的angularjs

时间:2015-09-17 06:23:14

标签: javascript angularjs version

var app = angular.module('myApp', []);
app.controller('validateCtrl', function($scope) {

});
<!DOCTYPE html>
<html>

<head>
  <!-- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> -->
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.8/angular.min.js"></script>
  <link href="style.css" rel="stylesheet" />
  <script src="script.js"></script>
</head>

<body ng-app="myApp">
  <div class="container">
    <div class="">
      <h1>Enter Details</h1>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-lg-5 col-sm-6 col-md-5 col-xs-12">
        <form class="form-group" ng-controller="validateCtrl" ng-submit="validateCtrl.$valid" name="myForm" novalidate>

          <p>
            <input type="text" class="form-control" name="user" ng-model="user" placeholder="Name" required>
            <span style="color:red" ng-show="myForm.user.$dirty && myForm.user.$invalid">
		<span ng-show="myForm.user.$error.required">Username is required.</span>
            </span>
          </p>

          <p>
            <input type="email" class="form-control" name="email" ng-model="email" ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/" placeholder="Email" required>
            <span style="color:red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
		<span ng-show="myForm.email.$error.required">Email is required.</span>
            <span ng-show="myForm.email.$error.email">Invalid email address.</span>
            </span>
          </p>

          <p>
            <input type="number" class="form-control" name="number" ng-pattern="/^[0-9]+$/" ng-maxlength="10" ng-model="number" placeholder="Phone Number" required>
            <span style="color:red" ng-show="myForm.number.$dirty && myForm.number.$invalid">
		<span ng-show="myForm.number.$error.required">Phone number is required.</span>
            <span ng-show="myForm.number.$error.number">Invalid phone number.</span>
            </span>
          </p>

          <p>
            <input class="btn btn-primary" type="submit" ng-disabled="myForm.user.$dirty && myForm.user.$invalid ||  
myForm.email.$dirty && myForm.email.$invalid || myForm.number.$dirty && myForm.number.$invalid">
          </p>

        </form>
      </div>
    </div>
  </div>

</body>

</html>

这是我的代码。当我使用旧版本的js文件时,将显示提交空白表单错误消息。但是当我使用较新的版本js文件时,将不会显示提交空白表单错误消息。

0 个答案:

没有答案