как проверить через две разные модели в угловых JS - PullRequest
Новая
       5

как проверить через две разные модели в угловых JS

0 голосов
/ 13 ноября 2018

Может кто-нибудь сказать, пожалуйста, как проверить по двум различным моделям в angularjs

Вот мой код:

http://plnkr.co/edit/Utsg7Zr8fsg7zzX5Naib?p=preview Я добавляю пользовательскую проверку с использованием пользовательской директивы

Требование

Должно отображаться сообщение об ошибке, когда пользователь вводит имя «First», оно проверяет длину «фамилии», если оно меньше 4. Оно должно отображать ошибку. name »длина меньше 4. Если да, должно отображаться сообщение об ошибке

Я делаю следующие шаги:

  1. Введите «а» в первое поле (оно станет красным, что нормально).

  2. но когда я набираю "abcderff" в фамилии, почему имя красное ?? 

    .directive("testfirst", function() {
    return {
        restrict: "A",
        require: 'ngModel',

        link: function(scope, element, attributes, modelVal) {

            modelVal.$validators.testfirst= function(val) {
              console.log(attributes.last)
              console.log((attributes.last && attributes.last.length < 4));
              if(val.length > 0 && !(attributes.last && attributes.last.length < 4)){

                return false
              }
               return true
            };
            scope.$watch("val", function() {
                modelVal.$validate();
            });

        }

    };
}).directive("testlast", function() {
    return {
        restrict: "A",
        require: 'ngModel',

        link: function(scope, element, attributes, modelVal) {

            modelVal.$validators.testlast= function(val) {
              if(val.length > 0 && !(attributes.first && attributes.first.length < 4)){
                return false
              }
              return true
            };
            scope.$watch("val", function() {
                modelVal.$validate();
            });

        }

    };
});

1 Ответ

0 голосов
/ 15 ноября 2018

Вы можете обратиться, я изменяю это содержание:

index.html 

<body ng-controller="MainCtrl">
  <button ng-click="submit()">Submit</button>
  <form name="myform">
    <table class="table table-bordered table-striped">
      <thead>
        <tr>
          <th width="50%">Field Name</th>
          <th class="smallcol" width="50%">Field Value</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="(key, value) in c">
          <td ng-if="value.type == 'LABEL'" colspan="2" style="background: #777; color: white;">{{key}}</td>
          <td ng-if="value.type == 'FIELD'">{{key}}</td>

          <td ng-if="value.type == 'FIELD' && isEditableMode && value.editable && value.dataType=='last'">
            <div class="form-group" ng-class="{'has-error': myform[key].$invalid}">
              <input type="text" name="{{key}}" first="{{getCheck('First')}}" class="form-control" ng-model="value.value" ng-keyup="update(value)" testlast>
            </div>
          </td>

          <td ng-if="value.type == 'FIELD' && isEditableMode && value.editable && value.dataType=='name'">
            <div class="form-group" ng-class="{'has-error': myform[key].$invalid}">
              <input type="text" last="{{getCheck('Last')}}" name="{{key}}" class="form-control" ng-model="value.value" ng-keyup="update(value)" testfirst>
            </div>
          </td>
        </tr>

      </tbody>
    </table>
  </form>

</body>

Отмечено:

Контрольный пример 1: должно отображаться сообщение об ошибке, когда пользователь вводит имя «First», проверять длину «фамилии», если оно меньше 4. Оно должно отображать ошибку

Контрольный пример 2: то же самое в фамилии, если пользователь вводит «фамилию», а затем проверяет, что длина «имени» меньше 4. Если да, должна отображаться ошибка

Завершить тестовый пример 1, после чего вы должны очистить все поля значения. после Вы будете проверять случай 2, потому что css показывает ошибку неправильно. Вы должны справиться с этим снова.

образец кода

...