Angular UI 引导轮播中奇怪的滑动行为答案

【问题标题】：Weird sliding behaviour in Angular UI bootstrap carouselAngular UI 引导轮播中奇怪的滑动行为
【发布时间】：2016-03-08 10:38:03
【问题描述】：

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

我希望将一些带有标题的链接连接到每张幻灯片，因此如果我单击该链接，它应该会滚动到该幻灯片。我设法做到了这一点，但滑动行为并不像预期的那样。这是一个显示奇怪行为的 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

最好的问候，丹尼尔

【问题讨论】：

那么奇怪的行为到底是什么？与当前幻灯片是什么和你想去的幻灯片的方向有关吗？
@Katana24 当我使用链接（例如 <a ng-click="car.active = 0">Slide 1</a> ）说要设置为活动的幻灯片时，滑动动画完全关闭。如果我使用内置的引导箭头，它滑动就好了
是的，我现在看到了 - 它变成白色然后切换到颜色 - 对吗？
@Katana24 没错，有什么想法吗？
是的 - 我现在正在调查它

标签： angularjs twitter-bootstrap-3 carousel angular-ui-bootstrap

【解决方案1】：

你有没有安装ng动画，

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

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

【讨论】：

是的，安装了 ng-animation，它正在滑动，但是当我使用链接（例如 <a ng-click="car.active = 0">Slide 1</a>）说要设置为活动的幻灯片时，滑动动画完全关闭。如果我使用内置的引导箭头，它完全可以滑动

【解决方案2】：

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

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

在'active'的$watch中“currentIndex = index;”在“self.select(slides[index]);”之前设置运行，在它工作后向下移动它

【讨论】：