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 템플릿을 보았지만 컨트롤러를 찾을 수 없었기 때문에 이것은 혼란 스러웠습니다.
케이스가이 문제를 해결했을 때 ‘/’경로를 제거했습니다.