angularjs – 角度ng重复添加引导行每3或4 cols
发布时间:2020-12-17 09:12:06 所属栏目:安全 来源:网络整理
导读:我正在寻找正确的模式注入引导行类每3列。我需要这个,因为cols没有固定的高度(我不想修复一个),所以它打破了我的设计! 这里是我的代码: div ng-repeat="product in products" div ng-if="$index % 3 == 0" class="row" div class="col-sm-4" ... /div /d
我正在寻找正确的模式注入引导行类每3列。我需要这个,因为cols没有固定的高度(我不想修复一个),所以它打破了我的设计!
这里是我的代码: <div ng-repeat="product in products"> <div ng-if="$index % 3 == 0" class="row"> <div class="col-sm-4" > ... </div> </div> </div> 但它只在每行中显示一个产品。我想要的最终结果是: <div class="row"> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> </div> <div class="row"> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> </div> 我可以用ng重复模式(无指令或控制器)实现这一点吗? docs引入ng-repeat-start和ng-repeat-end但是我不知道如何使用它是这个用例!我觉得这是我们经常在bootstrap模板中使用的东西! ?谢谢
我知道这有点晚了,但它仍然可能帮助某人。我做到了这样:
<div ng-repeat="product in products" ng-if="$index % 3 == 0" class="row"> <div class="col-xs-4">{{products[$index]}}</div> <div class="col-xs-4" ng-if="products.length > ($index + 1)">{{products[$index + 1]}}</div> <div class="col-xs-4" ng-if="products.length > ($index + 2)">{{products[$index + 2]}}</div> </div> jsfiddle (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |