angularjs - 有条件地显示/隐藏输入字段

时间:2015-10-07 19:44:01

标签: javascript jquery angularjs input

我正在制作一个用于记录锻炼的角度js应用程序。

当我点击日志锻炼按钮时,会弹出一个模态,其中包含输入字段以记录锻炼。

我想做的是使用指定锻炼类型的下拉菜单,并根据我选择的锻炼类型更改下面的输入字段。

例如:

如果我选择"运行"从下拉列表中,我希望这些字段出现: 开始时间: 时间结束: milage:

但如果我选择" weight",我希望这些字段显示为: 重量: 套数: 第1组: 第2集:

你明白了。我怎么能根据我选择的锻炼来做这个条件隐藏/显示输入字段?有什么好的资源可以解释这个吗?

2 个答案:

答案 0 :(得分:1)

您将需要ng-show ng-hide用于此目的。

<input ng-show="myDropDown=='two'" type="text">

以下是您参考http://jsfiddle.net/EZbfM/

的示例小提琴

答案 1 :(得分:0)

基本上你想看看ng-show和ng-hide。选择锻炼类型后,当所选锻炼类型使控件适用时,您需要在所有相关控件上显示ng-show表达式,评估为true。

https://docs.angularjs.org/api/ng/directive/ngShow