I am having issues with getting the carousel working properly. I used yeomen to scaffold the angular app. I am getting this error
Error: [$compile:ctreq] Controller 'carousel', required by directive 'slide', can't be found! http://errors.angularjs.org/1.2.26/$compile/ctreq?p0=carousel&p1=slide at http://localhost:9000/bower_components/angular/angular.js:78:12 at getControllers (http://localhost:9000/bower_components/angular/angular.js:6543:19) at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:6712:35) at http://localhost:9000/bower_components/angular/angular.js:6913:13 at http://localhost:9000/bower_components/angular/angular.js:8113:11 at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:11573:81) at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:11573:81) at http://localhost:9000/bower_components/angular/angular.js:11659:26 at Scope.$eval (http://localhost:9000/bower_components/angular/angular.js:12702:28) at Scope.$digest (http://localhost:9000/bower_components/angular/angular.js:12514:31) angular.js:10072 Error: [$compile:ctreq] Controller 'carousel', required by directive 'slide', can't be found! http://errors.angularjs.org/1.2.26/$compile/ctreq?p0=carousel&p1=slide at http://localhost:9000/bower_components/angular/angular.js:78:12 at getControllers (http://localhost:9000/bower_components/angular/angular.js:6543:19) at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:6712:35) at http://localhost:9000/bower_components/angular/angular.js:6913:13 at http://localhost:9000/bower_components/angular/angular.js:8113:11 at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:11573:81) at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:11573:81) at http://localhost:9000/bower_components/angular/angular.js:11659:26 at Scope.$eval (http://localhost:9000/bower_components/angular/angular.js:12702:28) at Scope.$digest (http://localhost:9000/bower_components/angular/angular.js:12514:31) angular.js:10072 here is my html file
my controller is
'use strict';
angular.module('myhApp') .controller('MainCtrl', function ($scope) { });
here is my app.js
angular .module('myhApp', [ 'ngAnimate', 'ngCookies', 'ngResource', 'ngRoute', 'ngSanitize', 'ngTouch', 'ui.bootstrap' ]) .config(function ($routeProvider) { $routeProvider .when('/', { templateUrl: 'views/main.html', controller: 'MainCtrl' }) .when('/about', { templateUrl: 'views/about.html', controller: 'AboutCtrl' }) .otherwise({ redirectTo: '/' }); });
I am not sure whats causing it. Any help will be appreciated.
** Some findings recently **
ok I did some digging around and found out that I have to have carousel in the dom for directive (as the error indicates). When I add carousel, the error goes away but my carousel doesnt work anymore and looks wonky as well.
Here is the change that I made to html
回答2:
data-slide is used by both Bootstrap and ui.bootstrap so there is a conflict here. If you want to use the plain Bootstrap carousel method you can tell angular to ignore a DOM element and it's children.
To do that insert ngNonBindable into the appropriate Dom element.
回答3:
As per gooseman's answer on SO:
angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition']) .controller('CarouselController', ['$scope', '$timeout', '$transition', '$q', function ($scope, $timeout, $transition, $q) { }]).directive('carousel', [function() { return { } }]);
回答4:
I have the same problem and I don't know why but if you delete in your HTML data-slide="prev" and data-slide="next" the error disappears.
回答5:
Just remove ui.bootstrap from the list of modules if you don't need it.
回答6:
Add ng-non-bindable and change href for data-target
>
回答7:
When building with angular forget bootstrap's javascript.Use only the css.Especially when using ngRoute.It reads the hashes from url amongst other things.For carousels, use ui.bootstrap.carousel, read the doc and see the example shown on the page.It's simple and concise.Otherwise there will always be an error in the console, that is if the carousel works.
