如何使用Angular JS中的ng-if条件隐藏选项值

时间:2016-08-19 10:18:37

标签: javascript html angularjs angular-ng-if

我有一个输入表单。我要比较的两个输入字段,如果条件为真,则显示值。 输入字段是: -

<td class="td_label"><label>Client Age :</label></td>
<td class="td_input"><input type="text" required="required" class="age" ng-model="age" name="age" maxlength="2">                          
</td>
<td class="td_label"><label>Test Age :</label></td>
<td class="td_input"><input type="number" required="required" class="libr" ng-model="libr" name="libr"  min="50" max="100">                       
</td>

<td class="td_label"><label>Rider Cost :</label></td>
<td class="td_select"><select ng-model="rider" name="rider" required>
    <option value="">Please Select</option>
    <option value="0.0001">Option 1 - 3% No Rider</option>
    <option  value=".75">Option 2 - IAV 5.5% Rider .75%</option>
    <option value=".9">Option 3 - IAV 6.0% Rider .90%</option>
    <option value=".85">Option 4 - IAV 5.5% Rider .85%</option>
    <option value="1.0">Option 5 - IAV 6.0% Rider 1.0%</option>
</select></td> 

现在,如果差异测试年龄超过10岁,我希望选择选项中的第3个选项不适用。我该怎么办?

3 个答案:

答案 0 :(得分:3)

在这种情况下,您只需使用ngHide

<option value=".9" ng-hide="libr && age && (libr - age > 10)">Option 3 - IAV 6.0% Rider .90%</option>

答案 1 :(得分:0)

试试这个

 <option ng-disabled="age >= 10" value=".9">Option 3 - IAV 6.0% Rider .90%</option>

here是工作小提琴

答案 2 :(得分:0)

只需将ng-hide="age - libr > 10"用于您要隐藏的DOM。