javascript - 根据选定的单选按钮将两个字段显示为必填字段

Question

我在 HTML 中有这个单选按钮。

<div class="radio">
  <label>
  <input id="vendor" type="radio" ng-model="c.data.cvendor" name="customerType" value="cvendor" ng-true-value="CVendor" ng-false-value="false">
  ${CVendor}
  </label> 
</div>

选中此选项后，应显示以下两个字段并且是必填字段。我怎样才能在 HTML 中实现这一点？

<div class="form-group is-required">
  <label for="fieldb">${FieldB}:</label>
  <input type="text" class="my-input" ng-model="c.data.fieldb" id="fieldb" placeholder="Enter Field B">
</div>
<div class="form-group is-required">
  <label for="fieldc">${FieldC}:</label>
  <input type="text" class="my-input" ng-model="c.data.fieldc" id="fieldc" placeholder="Enter Field C">
</div>

Answer 1

试试这个 ng-if="c.data.cvendor==='cvendor'"。

单选按钮将 c.data.cvendor 设置为“cvendor”。因此，您可以通过 ng-if

控制两个输入字段的显示

关于必填字段，可以试试ng-required="true"。

    <div class="form-group is-required" ng-if="c.data.cvendor==='cvendor'">
     <label for="fieldb">${FieldB}:</label>
     <input type="text" class="my-input" ng-model="c.data.fieldb" id="fieldb" placeholder="Enter Field B" ng-required="true">
    </div>

    <div class="form-group is-required" ng-if="c.data.cvendor==='cvendor'">
     <label for="fieldc">${FieldC}:</label>
     <input type="text" class="my-input" ng-model="c.data.fieldc" id="fieldc" placeholder="Enter Field C" ng-required="true">
    </div>