2016-03-14 2 views
1

Я делаю простую проверку требуемого, но не могу найти ng-Message, работая с неправильной записью или нажав кнопку. Может кто-нибудь помочь мне, где я ошибаюсь?ngMessage не работает в AngularJs

HTML:

<html> 
<head> 
    <!-- Script Files --> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.js"></script> 
</head> 
<body ng-app="myApp" ng-controller="myCtrl"> 

    <form name="form1" id="form1" novalidate> 
     <input type="text" name="age" ng-minlength="3" required/> 
     <div ng-messages="form1.age.$error" ng-show="(form1.age.$error.required || form1.age.$error.minlength) && (form1.age.$touched || form1.$submitted) " > 
      <div ng-message="required">This is required</div> 
      <div ng-message="minlength">Length is too less</div> 

     </div> 
     <a data-ng-click="submit(form1.$invalid)">Click</a> 
    </form> 

    <script> 
    //module declaration 
    var app = angular.module('myApp', ['ngMessages']); 
    //controller declaration 
    app.controller('myCtrl', function($scope) { 
     var submit = function(invalid){ 
      if(invalid) return; 
     } 
    }); 
    </script> 
</body> 
</html> 
+2

добавить файл с угловым сообщением js. //ajax.googleapis.com/ajax/libs/angularjs/XYZ/angular-messages.js –

+0

Возможный дубликат [ng-message не отображается] (http://stackoverflow.com/questions/35746963/ng-message- is-not-shows) – Zakaria

+0

Этот вопрос совершенно другой. Мина намного проще и связана с проверкой 1 единственного входа на основе $ touch и целых манипуляций. – Deadpool

ответ

4

Ваш вход возраст не имеет ng-model. Проверка ALA MINLENGTH работает только если ng-model присутствует:

<input type="text" name="age" ng-model="age" ng-minlength="3" required/> 

Это связано с тем, как работает валидаторы. Вы заметите, что ng-модель не установлена, когда $ valid является ложным. В документах всегда есть намек: https://docs.angularjs.org/api/ng/directive/ngMinlength

Также ng-model не обязательно должен совпадать с именем поля.

Смежные вопросы