Angular JS repeater + Bootstrap Carousel

Angular JS repeater + Bootstrap Carousel

本文关键字：Bootstrap Carousel repeater JS Angular      更新时间：2023-09-26

我试图用AngularJS的数据填充Bootstrap Carousel组件。基本上，我在carousel-inner类中填充项目，像这样:

 <div class="carousel-inner">
     <div class="item" ng-repeat="screen in app.screens">
       <img ng-src="screens/{{screen}}"  class="center"/>
     </div>
 </div>

这将工作得很好，但一开始我看不到任何图片，我认为这是因为我的项目没有active类。

在官方文档中:

<div class="carousel-inner">
    <div class="active item">…</div>
    <div class="item">…</div>
    <div class="item">…</div>
</div>

第一个div有"active"类，并且它是可见的，当我尝试像上面那样在没有Angular JS的情况下编写示例时，它可以工作。

如何将ng-repeat中的第一项设置为"active"类?

使用如下:

<div class="item" ng-repeat="screen in app.screens" ng-class="{active : $first}">

在中，您可以看到哪些属性是在本地作用域中公开的。

相关文章：