Obiekt nie jest funkcją w AngularJS

Question

Mam kontroler, który wydaje się być niepoprawny. Usunąłem wszystkie inne kod, który działa, aby ten krótki:

Kontroler:

'use strict'; 

angular.module('AppliedSiteApp').controller('CarouselCtrl', function ($scope) { 

    $scope.nextImage = function() { 
     console.log('hi'); 
    } 

}); 

Widok:

<div class="carousel" ng-controller="CarouselCtrl"> 

    <ul class="nav"> 
     <li ng-click="prevImage()">&lt;</li> 
     <li ng-click="nextImage()">&gt;</li> 
    </ul> 

</div> 

każdym razem klikam przycisk w przeglądarce to mówi: "TypeError: object nie jest funkcją" lub "nie zastępuje metody". Co ja robię źle?

Answer 1

Podczas tworzenia nowego modułu należy podać drugi parametr (jego zależności). Jeśli go nie masz, po prostu przekaż pustą tablicę.

angular.module('AppliedSiteApp', [])... 

Twój Przykładem może uzyskać dostęp do istniejący moduł (wtedy nie podasz drugiego argumentu), ale wtedy nie ma chyba jakiś kod brakuje do wykrycia błędu (lub jestem po prostu ślepy).

Answer 2

wypróbować następującą definicję kontrolera

var AppliedSiteApp = angular.module('AppliedSiteApp', []); 

function CarouselCtrl($scope) { 

    $scope.nextImage = function() { 
     console.log('hi'); 
    } 
} 

Answer 3

Coś jest nie tak z okazji jesteś okablowanie rzeczy wierzę. Zwykle używam tego rusztowania:

angular.module('AppliedSiteApp.controllers', []). 
    controller('CarouselCtrl', ['$scope', function($scope) { 
    $scope.nextImage = function() { 
     console.log('hi'); 
    } 
    }]); 

Pierwszym argumentem controller jest nazwą, a drugi jest tablicą. W tablicy definiujesz, jakie usługi wprowadzasz do kontrolera, a następnie definiujesz funkcję zwrotną z wprowadzonymi usługami jako parametrami.

Answer 4

Zgadzam się z innymi odpowiedziami, że to problem z okablowaniem. Spróbuj tego skrzypce jako przykład: http://jsfiddle.net/reblace/7fVQR/

Deklarują swoją zewnętrzną div tak:

<div ng-app="app" ng-controller="MainController"> 

A potem kontrolera takiego:

var app = angular.module('app', []); 
function MainController($scope) { ... } 

Answer 5

Czy nadal problem z tym?

Wpadłem na ten sam problem. Problemem dla mnie było to, że nazwa funkcji w kontrolerze i widoku była taka sama jak nazwa, której używałam w tym samym widoku.

Zmiana nazwy formularza lub nazwy funkcji naprawiła dla mnie błąd.