为什么AngularJS在点击另一个字段并更改值之前不会更新有效性?

时间:2017-08-16 14:25:58

标签: angularjs validation angular-forms

早上好!我仍然是AngularJS的新手,并没有找到我能完全理解的答案。

有一个结构如下:

  • 名称
  • 电子邮件
  • 颜色 [选项红色,选项蓝色]
    • 必填字段仅在选择'
    • 选项蓝色时才会显示

选择选项蓝色时,会显示第二组字段。但是,当取消选择' Option Blue'时,会再次隐藏必填字段,但表单仍然会看到'该字段为空,直到我点击另一个字段(例如' Name')并键入另一个值。

每次事件监听器(?)触发时,条件都会检查布尔 $ form。$ valid ,即onItemSelect和onItemDeselect以及onSelectionChange。

根据我对Angular的理解,我... 认为另一个摘要(?)周期尚未开始(?),直到我点击键入另一个字段?对不起所有的问号 - 我的知识有点夸张,我不能完全粘贴源代码。

我的理解是否正确?如果是这样,是否有任何建议的方法来解决此问题?

编辑:我在下面添加了一些示例代码,其中包含虚拟变量和对象名称,以及一些伪代码,用于汇总更大的代码段。

<script>
   var app = angular.module('myApp',[some stuff]);
   app.controller('myContropper', function ($scope, $rootScope, $timeout) {
         [some variables for scope]
         $scope.color = {};
         $scope.optionB = {
               hue: null;
               saturation: null;
         };
         [some other variables that only have values of OptionB is chosen and subsequent fields are populated]

         $scope.colorChange = function() {
              if color is changed, clear all associated arrays and values by setting it to either '[];' or 'null;'
         };

         $scope.checkForm = function() {
              if OptionB is not chosen, clear all options related to OptionB

              use $scope.form.$valid boolean value and do something with it
         };

         function onItemSelect(item) {
              if OptionB is selected, set the flag for that option to true
              $scope.checkForm();
         }
         function onItemDeselect(item) {
              if OptionB is not selected, set the flag for that option to false
              $scope.checkForm();
         }
   }
</script>

我已经设置了一些调试警报。我注意到当我取消选择OptionBlue时,警报将包含以下行:     requiredFieldifOptionBisChosen:object Object

但是,点击其他字段并键入任何值后,表单将刷新(?)有效性,并且它会说:     requiredFieldifOptionBisChosen:null

0 个答案:

没有答案