twitter-bootstrap - 切换/隐藏输入组

Question

在 Bootstrap 输入组中隐藏/切换 input-group-addon 跨度的最佳方法是什么？如果我只是删除它，圆角就会从输入中切掉 以及一些其他显示问题，例如宽度

https://jsfiddle.net/45f9nq94/

编辑:这是我想出的最好的解决方案，好吗？

https://jsfiddle.net/45f9nq94/1/

编辑:更接近真实交易的 Angular 示例

https://jsfiddle.net/45f9nq94/3/

更新:我重新考虑了解决方案，我认为它对用户来说也更好看 https://jsfiddle.net/45f9nq94/7/我唯一不喜欢的是我添加以将插件的内容包装在一个新的跨度中。知道如何使用 CSS 更改输入组插件跨度以在没有额外跨度的情况下做同样的事情吗？

Answer 1

我的解决方案是删除 input-group类以及隐藏 <span> .如:

 <div ng-class="{'input-group': ...}">
     <input ..../>
     <span ng-if="..." class="input-group-addon"></span>
 </div>