Html 如何将ng repeat中的最后一项居中

我正在使用ng repeat创建元素。
我使用了：

nth child（4n+1）

在一行中仅显示4个元素，但我希望最后一个div元素居中对齐。
有没有办法在角度上做到这一点？
假设有9个元素，我想在中间显示第9个元素

HTML:

<div class="container " ng-app="myApp" ng-controller="myCtrl">
  <div class="row LaunchTrackerBrands text-center" >
    <div class="col-md-2 col-sm-4 Brandtracker" ng-repeat="data in LauncherData">
      <div class="BrandName " title="{{data.Brand}}" >
        <img src={{data.src}} draggable="false" text-center/>
         <div class="Metaname">
            <div class="inner-triangle" style="border-left: {{data.color}} 30px solid"></div>
            {{data.name}}
          </div>
        </div>
      </div>
    </div>
  </div>

---

因此，您可以执行以下操作：在中，使用

$index

将当前的

索引保存在
ng repeat
中。然后使用
ng class
检查当前索引是否与循环列表的
length
相同，因此它是所有情况下的最后一项。如果条件为true，则添加一个将元素居中的
类


angular.module（“myApp”，[]）.controller（“myController”，函数（$scope）{
$scope.myList=[{
id:0，
案文：“项目1”
},
{
id:1，
案文：“项目2”
},
{
id:2，
正文：“第3项（最后一项）”
}
];
$scope.myList2=[{
id:0，
案文：“项目1”
},
{
id:1，
案文：“项目2”
},
{
id:2，
案文：“项目3”
},
{
id:3，
案文：“项目4”
},
{
id:4，
正文：“第5项（最后一项）”
}
];
});
.list{
显示器：flex；
弯曲方向：立柱；
}
.列表--居中{
对齐项目：居中；
}

{{item.text}{{idx}




{{item.text}{{idx}
因此，您可以执行以下操作：使用
$index
在
ng中保存当前的
索引。然后使用
ng class
检查当前索引是否与循环列表的
length
相同，因此它是所有情况下的最后一项。如果条件为true，则添加一个将元素居中的
类


angular.module（“myApp”，[]）.controller（“myController”，函数（$scope）{
$scope.myList=[{
id:0，
案文：“项目1”
},
{
id:1，
案文：“项目2”
},
{
id:2，
正文：“第3项（最后一项）”
}
];
$scope.myList2=[{
id:0，
案文：“项目1”
},
{
id:1，
案文：“项目2”
},
{
id:2，
案文：“项目3”
},
{
id:3，
案文：“项目4”
},
{
id:4，
正文：“第5项（最后一项）”
}
];
});
.list{
显示器：flex；
弯曲方向：立柱；
}
.列表--居中{
对齐项目：居中；
}

{{item.text}{{idx}




{{item.text}{{idx}
试试这个

<div class="col-md-2 col-sm-4 Brandtracker"
     ng-repeat="data in LauncherData"
     ng-class="{'alignCenter':$last}">
</div>



其中，
alignCenter
是将元素对齐到中心的类
 试试这个

<div class="col-md-2 col-sm-4 Brandtracker"
     ng-repeat="data in LauncherData"
     ng-class="{'alignCenter':$last}">
</div>



其中，
alignCenter
是将元素对齐到中心的类
 Angular不提供任何此类功能。你是在使用bootstrap、materialize还是什么？你可以使用css为最后一个孩子指定一个特定的样式：我使用bootstrap@abinthaha如果我有10个孩子，我希望其中两个孩子居中@ibenjelloun@ShubhamMundhra哪个版本的bootstrapAngular不提供任何此类功能。你是在使用bootstrap、materialize还是什么？你可以使用css为最后一个孩子指定一个特定的样式：我使用bootstrap@abinthaha如果我有10个孩子，我希望其中两个孩子居中@ibenjelloun@ShubhamMundhra如果有2个或3个元素，bootstrapWhat的哪个版本@mrbuggy@ShubhamMundhra我还在工作，因为他在任何情况下都会获取列表的长度，并使用长度和索引+1检查当前项是否是最后一项。因此，如果列表中有3个项目，长度=3，最后一个项目的索引+1将是3，然后它添加了用于居中的类。例如，如果有21个项目，那么长度将为21，最后一个项目的索引+1也将为21，然后再次添加用于居中的类。在每一种情况下，只有最后一种。看看我的照片example@ShubhamMundhra我用两个不同项目计数的列表编辑了答案。这是你的问题吗？此解决方案将css应用于所有最后3个ng重复元素，但我只想在下一行（一行4个）中应用css@mrbuggy如果有2个或3个元素呢@mrbuggy@ShubhamMundhra我还在工作，因为他在任何情况下都会获取列表的长度，并使用长度和索引+1检查当前项是否是最后一项。因此，如果列表中有3个项目，长度=3，最后一个项目的索引+1将是3，然后它添加了用于居中的类。例如，如果有21个项目，那么长度将为21，最后一个项目的索引+1也将为21，然后再次添加用于居中的类。在每一种情况下，只有最后一种。看看我的照片example@ShubhamMundhra我用两个不同项目计数的列表编辑了答案。这是你的问题吗？此解决方案将css应用于所有最后3个ng重复元素，但我只想在下一行（一行4个）的秋天应用css@mrbuggyn曾经看到$last，awesome解决方案！通过使用$last，我只能访问最后一个元素，但我也想访问最后一个元素@georgeawg@ShubhamMundhra那么你想把第二个元素也居中对齐吗？是的，我也想访问第二个元素@chinmayanNever saw$last，很棒的解决方案！通过使用$last，我只能访问最后一个元素，但我也想访问最后一个元素@georgeawg@ShubhamMundhra那么你想把第二个元素也居中对齐吗？是的，我想访问第二个元素@chinmayan