Question

我有这个当前的app.js

angular.module('app', ['ngRoute', 'ngSanitize', 'ui.bootstrap','ui.router', 'com.2fdevs.videogular', 'com.2fdevs.videogular.plugins.controls', 'com.2fdevs.videogular.plugins.overlayplay',
'com.2fdevs.videogular.plugins.poster', 'com.2fdevs.videogular.plugins.buffering', 'ngDraggable','angular-loading-bar', 'chart.js', 'angularSpinner'])

我在index.html中包含了所需的javascript文件

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-sanitize.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.1/ui-bootstrap-tpls.min.js"></script>

有了这个，旋转木马至少工作，没有过渡动画，但是如果我点击箭头就会切换到下一个。

然后我将index-animate添加到index.html：

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-animate.js"></script>

和ngAnimate到app.js作为依赖。

但这打破了旋转木马。有了这个，旋转木马就不会自行前进，点击箭头就什么也不做了。我没有在控制台中看到任何错误，也没有看到为什么这不起作用。我错过了一些CSS的东西还是什么？

Answer 1

这里可能有点晚了，但有一个解决方案。制定一个基本上禁用ng-animate的指令：

app.directive('disableAnimation', function ($animate) {
    return {
        restrict: 'A',
        link: function ($scope, $element, $attrs) {
            $attrs.$observe('disableAnimation', function (value) {
                $animate.enabled(!value, $element);
            });
        }
    }
});

然后添加属性＆＃34; disable-animation =＆＃39; true＆＃39;＆＃34;到你的旋转木马标签。另一个用户就另一个问题建议了这个解决方案。我拼命想找到他并给予他应得的信誉，如果我找到它，我会做一个编辑。

ngAnimate打破了现有的ui.bootstrap.carousel

1 个答案: