当目标属性未定义时,ngOptions和select,required属性得到满足

时间:2013-09-19 19:44:52

标签: angularjs

我真的不确定如何解释这一点,但我会尽我所能,我也有一个吸血鬼,所以希望有所帮助。

http://plnkr.co/edit/mbKvRoXl92f4zPJLxRGJ?p=preview

TLDR VERSION:

  1. 从下拉菜单中选择“abcdefg@yahoo.com”,以满足其所需的属性。
  2. 从“家庭电子邮件”输入字段中删除“abcdefg@yahoo.com”。
  3. 请注意,下拉菜单不再选择电子邮件,但仍然满足其必需属性。
  4. 长篇版本

    我所拥有的是一些输入字段,它们与数组中的对象相关联($ scope.contact.emails)。然后将包含这些对象的数组绑定到select元素。 select元素有一个ng-model指令,包含当前所选数组中的对象。

    当页面加载时,没有选择任何内容,因此绑定到选择的ng-model(default_email)未定义,并且select元素旁边显示“Required”文本。

    现在需要注意的是,“电子邮件”字段是必需的,但不需要“家庭电子邮件”字段。如果我在下拉列表中选择“首选电子邮件”是“家庭电子邮件”字段(abcdefg@yahoo.com)中的电子邮件,则满足选择要求,并且我的联系人对象中的default_email属性被分配了由该字段(default_email“:{”id“:”home_email“,”name“:”Home Email“,”address“:”abcdefg@yahoo.com“})

    问题是,如果我现在删除“Home Email”输入框的内容以使其为空,则选择更改为“Please Select Preferred Email”,但该对象仍然分配给default_email属性联系对象,现在它只缺少属性“地址”,因为它不再符合输入中指定的type =“email”的要求。真正的问题是我需要显示“必需”标签,但不是。这是因为定义了default_email,只有分配给它的对象缺少我实际需要的属性,即“地址”。

    非常感谢任何帮助,如果有更多细节或说明将有所帮助,请告诉我,对于角度来说真的很新,所以请耐心等待。

1 个答案:

答案 0 :(得分:0)

您有表单形式,因此外部表单contactForm看不到内部:ng-form="innerForm"

我不知道它的设计是否合适。

但有些可以解决:

添加到控制器:

 $scope.isRequired = function(){
  return $scope.isRequiredBool;
 };

 $scope.isEmpty = function(value){
   if(value == ''){
     $scope.isRequiredBool = true;
  } 
};

之后,将|| isRequired()添加到ng-show

<span ng-show="contactForm.default_email.$error.required || isRequired()" class="help-block">Required</span>

之后,将ng-change="isEmpty(email.address)"添加到innerForm输入。

应该有效:

Your modified Plunker

希望它对你有帮助,