见http://plnkr.co/edit/xqYBnz5BHLP844kXJXKs?p=preview
查看工作版本:http ://bkuhl.github.io/angular-form-ui/#!/slide-toggle
这里发生的是当 Angular 处理指令时有一个宽度计算。但是,该项目不可见,因此它没有宽度。此滑块上显示的标签是可自定义的,因此虽然它默认为开/关,但它可以是任何东西。这意味着滑块宽度需要完全可变。
是否可以更改此滑块的 CSS 以避免宽度计算?
见http://plnkr.co/edit/xqYBnz5BHLP844kXJXKs?p=preview
查看工作版本:http ://bkuhl.github.io/angular-form-ui/#!/slide-toggle
这里发生的是当 Angular 处理指令时有一个宽度计算。但是,该项目不可见,因此它没有宽度。此滑块上显示的标签是可自定义的,因此虽然它默认为开/关,但它可以是任何东西。这意味着滑块宽度需要完全可变。
是否可以更改此滑块的 CSS 以避免宽度计算?
不确定在每种情况下都有可能,但是在你的 plunker 中用 ng-if 替换 ng-show 就可以了(无需额外的 css/js)。
见这里:http ://plnkr.co/edit/dghyemUuBMfbIPgLJHPz?p=preview
它与 ng-if 一起使用,因为在条件评估为 true 之前不会调用该指令。从这里可以看到父 dom 元素并且宽度计算成功。另一方面,在 ng-show 的情况下,该指令被直接调用,并且由于其父 dom 元素是隐藏的(display:none;),因此宽度计算将“失败”。
仅供参考 ng-if 适用于 Angular 1.1.5 及更高版本。