我正在尝试使用ng-repeat指令将按钮添加到我的嵌入式表单中。它可以正常工作，但使用时按钮之间会失去间距ng-repeat。如果我自己删除ng-repeat按钮并为按钮添加完全相同的html，则按钮之间的间距还可以。
这是jsfiddle。
如果很奇怪，因为生成的html绝对相同。
让我们看一下呈现的HTML ...
首先是非角度的：
<div class="form-inline">
<div class="button-wrapper">
<button type="button" class="btn btn-default">
<span>123</span>
</button>
</div>
<div class="button-wrapper">
<button type="button" class="btn btn-default">
<span>123</span>
</button>
</div>
<div class="button-wrapper">
<button type="button" class="btn btn-default">
<span>123</span>
</button>
</div>
</div>
现在是Angular：
<div class="form-inline ng-scope" ng-controller="MyCtrl">
<!-- ngRepeat: button in buttons --><div class="button-wrapper ng-scope" ng-repeat="button in buttons">
<button type="button" class="btn btn-default">
<span class="ng-binding">123</span>
</button>
</div><!-- end ngRepeat: button in buttons --><div class="button-wrapper ng-scope" ng-repeat="button in buttons">
<button type="button" class="btn btn-default">
<span class="ng-binding">456</span>
</button>
</div><!-- end ngRepeat: button in buttons --><div class="button-wrapper ng-scope" ng-repeat="button in buttons">
<button type="button" class="btn btn-default">
<span class="ng-binding">789</span>
</button>
</div><!-- end ngRepeat: button in buttons -->
</div>
看到不同？手工键入的HTML中的按钮包装div之间有换行符和代码对齐空间，但是ng-repeat呈现的HTML中没有。这些换行符和空格在视觉上呈现为每个div之间的单个空格。可以通过删除手工键入的HTML的div之间的换行符来证明这一点。我相信引导程序的目的是除非明确定义，否则在按钮之间不留空格。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句