Question

我使用$index模数

<div ng-repeat="day in days" ng-class="{'col-xs-2':$index % 3 === 0}">
    <div class="days-group">
        <input id="{{day.value}}"type='checkbox' value="{{day.value}}" check-list='checked_days'> 
        <label for="{{day.value}}">{{day.name}}</label>
    </div>
</div>

尝试继续此标记http://pastebin.com/mWyezJDe

但它们并不相同，我无法弄清楚我的错误是什么。

Answer 1

请尽可能尝试这种方式：

    <div ng-repeat="day in days">
        <div class="col-xs-2" ng-if="$index % 3 == 0">
            <div class="days-group">
                <input id="{{day.value}}"type='checkbox' value="{{day.value}}" check-list='checked_days'> 
                <label for="{{day.value}}">{{day.name}}</label>
            </div>
        </div>
</div>

Answer 2

试试这个。这里发生的是，如果条件[$ index％3 === 0]为真，那么col-xs-2将适用

<div ng-repeat="day in days" ng-class="{true: 'col-xs-2'}[$index % 3 === 0]"></div>

Answer 3

在粘贴箱示例中，您基本上有 3 div具有'col-xs-2'类;前两个持有 3 天，最后一个持有 1 天：

<div class="col-xs-2"><!-- mon., tues., wed./ --></div>
<div class="col-xs-2"><!-- thur., fri., sat./ --></div>
<div class="col-xs-2"><!-- sun./--></div>

在你的ng-repeat版本中，你有 7 div，每个持有 1 天（并且其中只有三个拥有class =“col-xs-2” ）;这是完全不同的！

<div class="col-xs-2"><!-- mon --></div>
<div><!-- tues --></div>
<div><!-- weds --></div>
<div class="col-xs-2"><!-- thurs --></div>
<div><!-- fri --></div>
<div><!-- sat --></div>
<div class="col-xs-2"><!-- sun --></div>

要获得您想要的效果，您需要以下内容：

<div ng-repeat="daySet in [[0,1,2], [3,4,5], [6]]" class="col-xs-2">
    <div ng-repeat="dayNum in daySet" class="days-group">
        <input id="{{days[dayNum].name}}" type='checkbox' value="{{days[dayNum].value}}" check-list='checked_days'> 
        <label for="{{days[dayNum].name}}">{{days[dayNum].name}}</label>
    </div>
</div>

使用angularjs中的模数的ng类

3 个答案: