[angularjs] 오류 : 인수가 함수가 아니므로 정의되지 않았습니다.

Scala Play에서 AngularJS를 사용하면이 오류가 발생합니다.

오류 : ‘MainCtrl’인수는 함수가 아니므로 정의되지 않았습니다.

요일로 구성된 테이블을 만들려고합니다.

내 코드를 살펴보세요. 컨트롤러 이름을 확인했지만 올바른 것 같습니다. 참고 :이 SO 답변 에서 사용되는 코드

index.scala.html

@(message: String)

@main("inTime") {

<!doctype html>
<html lang="en" ng-app>
    <head>
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")">
    </head>
<div ng-controller="MainCtrl">
    <table border="1">
    <tbody ng-repeat='(what,items) in data'>
      <tr ng-repeat='item in items'>
        <td ngm-if="$first" rowspan="{{items.length}}">{{what}}</td>
        <td>{{item}}</td>
      </tr>
    </tbody>
  </table>
</div>
</html>
}

MainCtrl.js

(function() {
    angular.module('[myApp]', []).controller('MainCtrl', function($scope) {
        $scope.data = {
            Colors: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"]
        }
    });
}());



답변

[]모듈 이름 ([myApp])에서 제거

angular.module('myApp', [])

그리고 ng-app="myApp"html에 추가 하면 작동합니다.


답변

먼저. controller정의하는 컨트롤러 이름과 동일한 경로 정의
가 올바른지 확인하십시오.

communityMod.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/members', {
        templateUrl: 'modules/community/views/members.html',
        controller: 'CommunityMembersCtrl'
      }).
      otherwise({
        redirectTo: '/members'
      });
  }]);

communityMod.controller('CommunityMembersCtrl', ['$scope',
    function ($scope) {
        $scope.name = 'Hello community';
    }]);

이 예에서 컨트롤러 이름이 다르면 오류가 발생하지만이 예는 정확합니다.

두 번째로 자바 스크립트 파일을 가져 왔는지 확인합니다.

<script src="modules/community/controllers/CommunityMembersCtrl.js"></script>


답변

동일한 오류 메시지가 표시되었습니다 (제 경우 : “인수 ‘languageSelectorCtrl’은 함수가 아니므로 정의되지 않았습니다”).

Angular seed의 코드와 지루한 비교를 한 후 이전에 app.js에서 컨트롤러 모듈에 대한 참조를 제거했음을 알게되었습니다. ( https://github.com/angular/angular-seed/blob/master/app/js/app.js에서 찾아보십시오. )

그래서 나는 이것을 가지고 있었다 :

angular.module('MyApp', ['MyApp.filters', 'MyApp.services', 'MyApp.directives'])

이것은 실패했습니다.

그리고 누락 된 참조를 추가했을 때 :

angular.module('MyApp', ['MyApp.filters', 'MyApp.services', 'MyApp.controllers', 'MyApp.directives'])

오류 메시지가 사라지고 Angular가 컨트롤러를 다시 시작할 수 있습니다.


답변

때때로이 오류는 html에 지정된 두 가지 ng-app 지시문 의 결과입니다 . 실수로 내 경우에는 내가 지정했던 ng-app내에서 html태그와 ng-app="myApp"body이런 태그 :

<html ng-app>
  <body ng-app="myApp"></body>
</html>


답변

이것은 심각하게 4 시간이 걸렸지 만 (SO에 대한 끝없는 검색 포함) 마침내 발견했습니다. 실수로 (의도하지 않게) 어딘가에 공백을 추가했습니다.

당신은 그것을 발견 할 수 있습니까?

angular.module('bwshopper.signup').controller('SignupCtrl ', SignupCtrl);

그래서 … 4 시간 후에 나는 그것이 다음과 같아야한다는 것을 알았습니다.

angular.module('bwshopper.signup').controller('SignupCtrl', SignupCtrl);

육안으로는 거의 볼 수 없습니다.

이는 개정 제어 (git 또는 기타) 및 단위 / 회귀 테스트의 중요성을 강조합니다.


답변

나는 같은 문제가 발생했으며 내 경우에는이 문제의 결과로 발생했습니다.

컨트롤러를 별도의 모듈 ( ‘myApp.controllers’라고 함)에 정의하고 다음과 같이 기본 앱 모듈 ( ‘myApp’이라고 함)에 삽입했습니다.

angular.module('myApp', ['myApp.controllers'])

동료가 별도의 파일에 다른 컨트롤러 모듈을 푸시했지만이 오류를 일으킨 내 이름과 똑같은 이름 (예 : ‘myApp.controllers’)을 사용했습니다. Angular가 컨트롤러 모듈 사이에서 혼란스러워서 생각합니다. 그러나 오류 메시지는 무엇이 잘못되었는지 발견하는 데별로 도움이되지 않았습니다.


답변

제 경우에는 (개요 페이지와 “추가”페이지가 있음) 아래와 같은 라우팅 설정을 통해이 정보를 얻었습니다. 삽입 할 수없는 AddCtrl에 대한 메시지를 제공했습니다.

$routeProvider.
  when('/', {
    redirectTo: '/overview'
  }).
  when('/overview', {
    templateUrl: 'partials/overview.html',
    controller: 'OverviewCtrl'
  }).
  when('/add', {
    templateUrl: 'partials/add.html',
    controller: 'AddCtrl'
  }).
  otherwise({
    redirectTo: '/overview'
  });

when('/'경로 때문에 모든 경로가 개요로 이동했고 컨트롤러는 / add 경로 페이지 렌더링에서 일치하지 못했습니다. add.html 템플릿을 보았지만 컨트롤러를 찾을 수 없었기 때문에 이것은 혼란 스러웠습니다.

케이스가이 문제를 해결했을 때 ‘/’경로를 제거했습니다.