如何根据ui引导程序carousel中的索引更新另一个div

Question

我想在旋转木马中显示图像，并且在我的Angular项目中使用ui引导程序旋转木马。当一个图像显示在转盘中时，我想用与该图像相关的文本更新另一个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，您可以在slide标签上指定active属性

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

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

我已经在这个plnkr 中输出了幻灯片json