Question

我想在旋转木马中显示图像，并在我的Angular项目中使用ui-bootstrap轮播。当图像显示在轮播中时，我想用与图像相关的文本更新另一个DIV。

<div ng-controller="carouselCtrl">
      <div style="height: 305px; width:205px; align-content: center">
          <carousel interval="myInterval">
              <slide ng-repeat="player in players" >
                  <img ng-src="data:image/*;base64,{{player.ProfileImage}}" style="margin:auto;">
              </slide>
           </carousel>
       </div>
 </div>

我的播放器对象包含有关我想在旋转木马下的另一个div中显示的玩家的信息。我怎么能这样做？

Answer 1

根据ui.bootstrap文档中引用的plnkr，您可以在active标记上指定slide属性

<slide ng-repeat="player in players" active="player.active">

因此，您可以在旋转木马下面使用上面的旋转木马进行另一次重复重复，并根据活动属性有条件地显示。或者使用过滤器来获得活动过滤器。

我已在此plnkr

中输出幻灯片json

如何根据ui-bootstrap轮播中的索引更新另一个div？

1 个答案: