如何避免宽度计算，这可以用CSS完成吗？

Question

请参阅http://plnkr.co/edit/xqYBnz5BHLP844kXJXKs?p=preview

查看工作版：http://bkuhl.github.io/angular-form-ui/#!/slide-toggle

这里发生的是Angular处理指令时的宽度计算。但是，该项目不可见，因此没有宽度。此滑块上显示的标签是可自定义的，因此默认为开/关，它可以是任何东西。这意味着滑块宽度需要完全变化。

是否可以更改此滑块的CSS以避免宽度计算？

Answer 1

不确定在每种情况下是否都可以，但是用ng-replace替换ng-show将会解决问题（没有额外的css / js）。

见这里：http://plnkr.co/edit/dghyemUuBMfbIPgLJHPz?p=preview

它正在使用ng-if，因为在将条件评估为true之前不会调用该指令。从这里可以看到父dom元素，并且宽度计算成功。另一方面，在ng-show的情况下，直接调用该指令，并且由于其父dom元素被隐藏（display：none;），因此宽度计算将“失败”。

FYI ng-if适用于Angular 1.1.5及更高版本。