twitter-bootstrap 无法找到指令“ngTransclude”所需的控制器“轮播”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20137900/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Controller 'carousel', required by directive 'ngTransclude', can't be found
提问by jhnferraris
Our team implemented a twitter bootstrap carousel for our front page. Everything's working fine for Chrome and Firefox. However when we tested it in IE 8, the carousel images were broken and the error thrown in the IE console was
我们的团队为我们的首页实施了 twitter bootstrap carousel。Chrome 和 Firefox 一切正常。但是,当我们在 IE 8 中对其进行测试时,轮播图像被破坏并且在 IE 控制台中抛出的错误是
Controller 'carousel', required by directive 'ngTransclude', can't be found
Here's the code (in haml) for our carousel:
这是我们轮播的代码(以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
Our first approach was to destroy the carousel (hence, the ff-destory-carouseldirective) if the browser is IE 8 and utilized bowser.js for browser checking. But still the script error still pops up.
ff-destory-carousel如果浏览器是 IE 8 并使用 bowser.js 进行浏览器检查,我们的第一种方法是销毁轮播(因此是指令)。但仍然会弹出脚本错误。
Any thoughts on why this kind of error is still happening in IE 8 and if their are possible workarounds for this?
关于为什么在 IE 8 中仍然发生这种错误的任何想法,以及他们是否有可能的解决方法?
回答by goooseman
Easy fix without disabling ui.bootstrap, just reinitialize carousel directive in your own .js file:
无需禁用 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 {
}
}]);
You can read about this in my blog(russian).
您可以在我的博客(俄语)中阅读有关此内容的信息。
回答by mahery rafara
I am having the same issue with the last angular-ui-bootstrap 3 branch.
The Carousel directive is being called when you use class="carousel"and slide="".
我对最后一个 angular-ui-bootstrap 3 分支有同样的问题。使用class="carousel"and时会调用 Carousel 指令slide=""。
It looks like a bug in angularjs 1.2 because it should only be compiled on Element or Attribute. I am not expert enough to look into $scompile
它看起来像 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'
removing ui.bootstrap.carousel from the depencencies "solve" the issue (even though it shouldn't be the problem here)
从依赖项中删除 ui.bootstrap.carousel 可以“解决”问题(即使这里不应该是问题)

