Как проверить NG-шаблон, когда пользователь начинает вводить (длина поля ввода> 0) в angularjs? - PullRequest
0 голосов
/ 22 мая 2018

Я хочу проверить шаблон проверки, если длина поля ввода> 0, как я могу это сделать.

ожидание

  1. когда поле ввода пусто, показывая требуемое сообщение (коснулся)
  2. После начала ввода необходимо проверить шаблон, если шаблон не совпадает, необходимо отобразить. Пожалуйста, введите действительный ввод, и если для длины поля ввода 0 необходимо отобразить только обязательное сообщение

(function(angular) {
  'use strict';
angular.module('ngMessagesExample', ['ngMessages']);
})(window.angular);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular-messages.js"></script>


<div ng-app='ngMessagesExample'>
   <!-- App goes here -->
   <form name="test" novalidate ng-submit="test.$valid && submit()">
      <div layout-gt-md="row">
         <md-input-container class="md-block" flex-gt-xs>
            <label>Number</label>
            <input  required ng-model="user.number" name="number" ng-pattern="/^[0-9]+(\.[0-9]{1,2})?$/" >
            <div ng-messages="test.number.$error">
            </div>
            <div ng-messages="test.$error" ng-show="test.number.$dirty">
               <div ng-message="required">number is required</div>
            </div>
            <span ng-show="!test.number.$valid">Please Enter Valid Input</span>
         </md-input-container>
      </div>
   </form>
</div>

демо

помогите мне

1 Ответ

0 голосов
/ 22 мая 2018

я обновил код в HTML

<!doctype html>
<html lang="en">
<head>

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular-messages.js"></script>
  <script src="script.js"></script>

</head>
<body>

  <div ng-app='ngMessagesExample'>
    <!-- App goes here -->
     <form name="test" novalidate ng-submit="test.$valid && submit()">
    <div layout-gt-md="row">
   <md-input-container class="md-block" flex-gt-xs>
      <label>Number</label>
      <input  required ng-model="user.number" name="number" ng-pattern="/^[0-9]+(\.[0-9]{1,2})?$/" >
      <div ng-messages="test.number.$error">


      </div>
      <div ng-messages="test.$error" ng-show="test.number.$dirty"><div ng-message="required">number is required</div></div>

      <span ng-show="test.number.$error.pattern">Please Enter Valid Input</span>
   </md-input-container>
</div>
</form>

</div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...