我们的团队为我们的头版实施了一个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
如果浏览器是IE 8并使用bowser.js进行浏览器检查,我们的第一种方法是销毁轮播(因此,ff-destory-carousel
指令)。但仍然会弹出脚本错误。
有关为什么在IE 8中仍然会发生此类错误的任何想法,以及它们是否可能适用于此?
答案 0 :(得分:21)
轻松修复而不禁用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 {
}
}]);
您可以在my blog(俄语)中阅读此内容。
答案 1 :(得分:4)
我和最后一个angular-ui-bootstrap 3分支有同样的问题。
使用class="carousel"
和slide=""
时会调用Carousel指令。
它看起来像angularjs 1.2中的一个错误,因为它只应该在Element或Attribute上编译。我不够专业,无法查看$ 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 (尽管这不应该是问题)