如何添加「必要」屬性輸入字段基於其他字段值

Question

我有這些輸入字段：

<input class="text_field" id="ProfilePhoneNumber" phone-by-state="User.PhoneNumber" type="text" required/> 

<div class="btn-group"> 
    <button multi-select="User.Notifications.Phone" class="btn btn-default dropdown-toggle"> 
     Select Severities <span class="caret"></span></button> 
    <ul multi-select-dropdown class="dropdown-menu"> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_1" 
        ng-model="User.Notifications.Phone.High"> 
      <label for="NotificationsPhone_1">High</label> 
     </li> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_2" 
        ng-model="User.Notifications.Phone.Medium"> 
      <label for="NotificationsPhone_2">Medium</label> 
     </li> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_3" 
        ng-model="User.Notifications.Phone.Low"> 
      <label for="NotificationsPhone_3">Low</label> 
     </li> 
    </ul> 
</div> 

<div><input id="SMS" type="checkbox" 
     ng-model="User.SMS.Enabled">SMS Enable 
</div> 

我想刪除從ProfilePhoneNumber文本字段中的「必要」的屬性，使其只需要如果至少有其中一個複選框被選中。

我可以通過HTML嗎？角？ jQuery的？ 什麼是最好的方法？

Answer 1

可以使用ng-required這裏

<input class="text_field" id="ProfilePhoneNumber" phone-by-state="User.PhoneNumber" type="text" 
    ng-required="User.Notifications.Phone.High == 1 || User.Notifications.Phone.Medium == 1 || User.Notifications.Phone.Low == 1 || User.SMS.Enabled == 1" /> 

ng-required將套required屬性的元素上，如果表達式傳遞給ng-required套到true。

Answer 2

您可以使用angularjs 「NG-需要」

<input class="text_field" id="ProfilePhoneNumber" phone-by-state="User.PhoneNumber" type="text" ng-required="User.Notifications.Phone.High || User.Notifications.Phone.Medium || User.Notifications.Phone.Low"/> 

<div class="btn-group"> 
    <button multi-select="User.Notifications.Phone" class="btn btn-default dropdown-toggle"> 
     Select Severities <span class="caret"></span></button> 
    <ul multi-select-dropdown class="dropdown-menu"> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_1" 
        ng-model="User.Notifications.Phone.High"> 
      <label for="NotificationsPhone_1">High</label> 
     </li> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_2" 
        ng-model="User.Notifications.Phone.Medium"> 
      <label for="NotificationsPhone_2">Medium</label> 
     </li> 
     <li> 
      <input type="checkbox" id="NotificationsPhone_3" 
        ng-model="User.Notifications.Phone.Low"> 
      <label for="NotificationsPhone_3">Low</label> 
     </li> 
    </ul> 
</div>