Le 'carrousel' du contrôleur, requis par la directive 'ngTransclude', est introuvable

Notre équipe a mis en œuvre un twitter bootstrap carrousel pour notre page d'accueil. Tout fonctionne très bien pour Chrome et Firefox. Cependant, lorsque nous l'avons testé sous IE 8, le carousel d'images ont été brisées et de l'erreur de jetée dans l'IE de la console a été

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

Voici le code (en haml) pour notre carrousel:

%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

Notre première approche a été de détruire le carrousel (d'où le ff-destory-carousel directive) si le navigateur est IE 8 et utilisé bowser.js pour le navigateur de la vérification. Mais toujours l'erreur de script encore pop up.

Des idées sur le pourquoi de ce type d'erreur se produit toujours dans IE 8 et si leurs sont les solutions possibles pour cela?

source d'informationauteur Jhn

  1. 21

    Solution facile sans la désactivation de l'interface utilisateur.bootstrap, juste réinitialiser le carrousel de la directive dans votre propre .fichier js: 

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

    }
}]);

    Vous pouvez lire à ce sujet dans mon blog (en russe).

  2. 4

    Je vais avoir le même problème avec la dernière angular-ui-bootstrap 3 branche.
    Le Carrousel de la directive est appelée lorsque vous utilisez class="carousel" et slide="".

    Il ressemble à un bug dans angularjs 1.2, car il ne doit être compilé sur l'Élément ou de l'Attribut. Je ne suis pas assez expert pour examiner $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'

    la suppression de l'interface utilisateur.bootstrap.le carrousel de la depencencies "résoudre" le problème
    (même si il ne devrait pas être le problème ici)