Question

我想我错过了$validators和$setValidity的东西（据我所知，做同样的事情所以你不需要两者 - 如果我错了请纠正我）。我是否在那里有$validators语句，我将ng-invalid类添加到输入表单中，这是在输入周围添加红色边框。那我为什么需要$validators？如果用户没有从指令模板的dropdownn中选择一行，我试图将父表单设置为无效。我不想显示任何错误消息或任何内容，我只想添加无效的类和红色边框，如果选择了下拉列中的行。

我应该使用$validators还是$setValidity？我是否同时需要$validator和$setValidity？此外，$setValidity是否需要ngModelCtrl？如果setValidity不在$validators函数内，我的$validators未定义。任何帮助表示赞赏。

如果我想在没有选择的情况下使父表单作为一个整体无效，并且当我触摸时我得到无效的类，然后如果没有$setValidity和{{1}进行选择则模糊那么为什么我需要$validators和$setValidity ??

的index.html

   <form name="myForm">
      <validator 
         rows="[{name:'tom', city:'san fran', state: 'mn', zip: 34212},
               {name: 'joe', city:'san fran', state: 'mn', zip: 45675}]"
         ng-required="true"
         ng-model="hey">
      </validator>
  </form>

validate.js - DDO

   return {
      restrict: 'E',
      require: {
      ngModelCtrl: 'ngModel',
      formCtrl: '?^form'
   },
      replace: true,
      templateUrl: 'view.html',
      scope: {},
      controllerAs: 'ctrl',
      bindToController: {
         rows: '=',
         onSelected: '&?', //passsed selected row outside component
         typedText: '&?', //text typed into input passed outside so 
                          //developer can create a custom filter,
                          //overriding the auto
         textFiltered: '@?', //text return from the custom filter
         ngRequired: "=?" //default false, when set to true the component
             //needs to validate that something was selected on blur.
             //The selection is not put into the input element all the
             //time so it can't validate based on whether or not
             //something is in the input element itself. 
             //I need to validate inside the controller where I can see
             //if 'this.ngModel' (selectedRow - not passed through scope)
             //is undefined or not.
        },
         controller: 'validatorController'
  };

。

   function validatorController () {
         var ctrl = this;
         var rowWasSelected = false;
         var input = ctrl.formCtrl.inputField; 

         //called via ng-click on the dropdown row
         //if this is called a row was selected
         ctrl.rowSelected = function (row){
             rowWasSelected = true;
         }

         //called via ng-blur of the input element
         ctrl.ngModelCtrl.$validators.invalidInput = function (modelValue, viewValue) {
               return rowWasSelected;
           }


         ctrl.$onInit = $onInit; //angular will execute this after 
             //all conrollers have been initialized, only safe to use
             //bound values (through bindToController) in 
             //the $onInit function.

             //i understand this need to be there with Angular 1.5 
             //using ngModel in the controller
             //but I really only need to validate on ng-blur of the input
        function $onInit() {
              ctrl.validateInput();
            }
           }
         };
      }

view.html - 指令

的模板

   <div class="dropdown" ng-class="{'open' : ctrl.isOpen}">
      <div class="form-group">
        <input type="text" class="form-control" name="inputField"
               placeholder="select" ng-click="ctrl.openDropdown()"
               ng-blur="ctrl.validateInput()" 
               ng-model="ctrl.currentRow.name"
               ng-required="ctrl.ngRequired">
       </div>
   <ul class="dropdown-menu list-group">
      <li class="list-group-item" ng-repeat="row in ctrl.rows"
          ng-click="ctrl.onSelectedLocal(row)">
             {{row.name}}
      </li>
   </ul>
  </div>

无论我有$validators函数，我都必须得到无效的类，因为它添加了ng-invalid类是否存在？

Answer 1

$setValidity(validationErrorKey, isValid);

更改有效状态，并通知表单。

可以在$parsers/$formatters或自定义验证实现中调用此方法。但是，在大多数情况下，使用会自动调用ngModel.$validators的{{1}}和ngModel.$asyncValidators集合就足够了。¹

$ validators和$ setValidity有什么意义？

的index.html

validate.js - DDO

view.html - 指令

1 个答案:

`$setValidity(validationErrorKey, isValid);`