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

【问题标题】：How to hide option value using ng-if condition in Angular JS如何在 Angular JS 中使用 ng-if 条件隐藏选项值
【发布时间】：2016-08-19 10:18:37
【问题描述】：

我有一个输入表单。如果条件为真，我想比较和显示值的两个输入字段。输入字段是：-

<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 ，我希望我的选择选项中的第三个选项不适用。我该怎么办？

【问题讨论】：

您可以使用 ngOptions 绑定值以选择输入。根据年龄的值 - 在更改时，您可以编写逻辑来包含或排除一个选项。
@ChandrasekarG 我同意你的看法。您可能希望管理选项控制器端，而不是在视图中应用登录。

标签： javascript html angularjs angular-ng-if

【解决方案1】：

在这种情况下，您可以简单地使用ngHide：

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

【讨论】：

【解决方案2】：

试试这个

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

here 是工作小提琴

【讨论】：

没有注意到您的情况，但您可以在适当的情况下使用ng-disabled。

【解决方案3】：

只需对要隐藏的 DOM 使用 ng-hide="age - libr > 10"。

【讨论】：