无法找到指令'ngTransclude'所需的控制器'carousel'

Question

我们的团队为我们的头版实现了一个Twitter bootstrap轮播.一切都适用于Chrome和Firefox.然而,当我们在IE 8中测试它时,轮播图像被破坏并且IE控制台中出现了错误

Controller 'carousel', required by directive 'ngTransclude', can't be found

这是我们轮播的代码(以haml为单位):

%carousel.featuredTags{'ff-destroy-carousel' => 'true', 'interval' => "5000"}
%slide
  %img{:src => "#{$assetsPath}/img/pic-bora.png", :alt => ""}
    .dimmer
    .caption Boracay beach, Aklan
%slide
  %img{:src => "#{$assetsPath}/img/pic-bora.png", :alt => ""}
    .dimmer
    .caption Boracay beach, Aklan
%slide
  %img{:src => "#{$assetsPath}/img/pic-bora.png", :alt => ""}
    .dimmer
    .caption Boracay beach, Aklan
%slide
  %img{:src => "#{$assetsPath}/img/pic-bora.png", :alt => ""}
    .dimmer
    .caption Boracay beach, Aklan

ff-destory-carousel如果浏览器是IE 8并使用bowser.js进行浏览器检查,我们的第一种方法是销毁轮播(因此,指令).但仍然会弹出脚本错误.

有关为什么在IE 8中仍然会发生此类错误的问题,以及它们是否可能为此进行解决？

Answer 1

轻松修复而不禁用ui.bootstrap,只需在您自己的.js文件中重新初始化carousel指令:

angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
    .controller('CarouselController', ['$scope', '$timeout', '$transition', '$q', function        ($scope, $timeout, $transition, $q) {
}]).directive('carousel', [function() {
    return {

    }
}]);

你可以在我的博客(俄语)中读到这个.

Answer 2

我对最后一个 angular-ui-bootstrap 3 分支有同样的问题。class="carousel"当您使用和时，将调用 Carousel 指令slide=""。

它看起来像 angularjs 1.2 中的一个错误，因为它只能在元素或属性上编译。我不够专业，无法研究 $scompile

.directive('carousel', [function() {
  return {
    restrict: 'EA',
    transclude: true,
    replace: true,
    controller: 'CarouselController',
    require: 'carousel',
    templateUrl: 'template/carousel/carousel.html',
    scope: {
      interval: '=',
      noTransition: '=',
      noPause: '='
    }
  };
}])

.directive('slide', ['$parse', function($parse) {
  return {
    require: '^carousel',
    restrict: 'EA',
    transclude: true,
    replace: true,
    templateUrl: 'template/carousel/slide.html'

从依赖项中删除 ui.bootstrap.carousel 可以“解决”问题（即使它不应该是这里的问题）