Angular UI bootstrap 旋转木马中的奇怪滑动行为

Question

我正在做一个项目，我想在其中使用轮播来显示一些不同的内容。我不会使用 ng-repeat 动态创建幻灯片，这是因为我必须将 DOM 其他部分的一些内容移动到幻灯片中。

我想要一些 link 的标题连接到每张幻灯片，所以如果我单击那个 link 它应该滚动到那张幻灯片。我设法做到了这一点，但滑动行为并不像预期的那样。这是一个 plunker，其中显示了奇怪的行为：http://plnkr.co/edit/oZrLzRaLb5cAmMBnz4p0?p=preview

<div ng-controller="CarouselDemoCtrl as car">
 <a ng-click="car.active = 0">Slide 1</a>
 <a ng-click="car.active = 1">Slide 2</a>
 <a ng-click="car.active = 2">Slide 3</a>
 <uib-carousel ng-model="" active="car.active" interval="0" no-wrap="true" no-transition="false">
  <uib-slide index="0">
    <div style="background:blue; height:600px;">
      Some content in here
    </div>
  </uib-slide>
  <uib-slide index="1">
    <div style="background:red; height:600px;">
      Some content in here as well
    </div>
  </uib-slide>
  <uib-slide index="2">
    <div style="background:green; height:600px;">
      Some cool content in here
    </div>
  </uib-slide>
 </uib-carousel>
</div>

知道为什么会发生这种情况，我该如何解决？

注意：我使用 angular 1.5.0 和 ui-bootstrap 1.2.4

此致，丹尼尔

Answer 1

你有没有安装ng动画，

或者你不想滑动你可以编辑 transition="true" 来禁用它

 <uib-carousel ng-model="" active="car.active" interval="0" no-wrap="true" no-transition="true">

Answer 2

https://github.com/angular-ui/bootstrap/issues/5601

问题似乎出在 angular-ui 代码本身；

在'active'的$watch中"currentIndex = index;"设置在"self.select(slides[index]);"为运行之前，在它之后向下移动它就可以了

Angular UI bootstrap 旋转木马中的奇怪滑动行为

Weird sliding behaviour in Angular UI bootstrap carousel

carousel

angularjs

angular-ui-bootstrap

twitter-bootstrap-3