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


6 Answers

먼저. 정의중인 컨트롤러 이름과 동일한 경로 정의에 올바른 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';
    }]);

이 예의 서로 다른 컨트롤러 이름은 오류로 이어지지 만이 예는 정확합니다.

두 번째 는 javascript 파일을 가져 왔는지 확인합니다.

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

Question

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

오류 : 인수 'MainCtrl'이 (가) 정의되지 않은 함수가 아닙니다.

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

내 코드를 한번보세요. 컨트롤러의 이름을 확인했지만 올바른 것 같습니다. 참고 :이 SO answer 에서 사용 된 코드

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.controllers')에 정의하고 다음과 같이 'myApp'라고하는 기본 앱 모듈에 주입했습니다.

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

동료가 별도의 파일에 다른 컨트롤러 모듈을 밀어 넣었으나이 오류의 원인이 된 동일한 이름 (예 : 'myApp.controllers')을 사용했습니다. Angular가 컨트롤러 모듈들 사이에서 혼란스러워했기 때문에 나는 생각합니다. 그러나 오류 메시지는 무엇이 잘못되었는지 발견하는 데별로 도움이되지 못했습니다.




서브 모듈에 있다면, 메인 어플리케이션에 모듈을 선언하는 것을 잊지 마십시오. 즉 :

<scrip>
angular.module('mainApp', ['subModule1', 'subModule2']);

angular.module('subModule1')
   .controller('MyController', ['$scope', function($scope) {
      $scope.moduleName = 'subModule1';
   }]);
</script>
...
<div ng-app="mainApp">
   <div ng-controller="MyController">
   <span ng-bind="moduleName"></span>
</div>

mainApp에서 subModule1을 선언하지 않으면 "[ng : areq] 인수가 있습니다."MyController "는 정의되지 않은 함수가 아닙니다.




이 오류는 html에 지정된 두 개의 ng-app 지시문의 결과입니다. 제 경우에는 실수로 html 태그에서 ng-app 를 지정하고 body 태그에서 ng-app="myApp" 를 다음과 같이 지정했습니다.

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



그것은 자산을 ""둘러싸는 것만 큼 간단 할 수 있고, 내부에는 "?"으로 따옴표가 필요합니다.

<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")">

된다

<link rel="stylesheet" media="screen" href="@routes.Assets.at('stylesheets/main.css')">

그 때문에 파싱에 몇 가지 문제가 발생할 수 있습니다.




주 index.html에서 사용한 LoginController에 오류가 있습니다. 해결할 수있는 두 가지 방법을 찾았습니다.

  1. $ controllerProvider.allowGlobals ()를 설정하면 Angular change-list 에있는 주석을 발견했습니다. "이 옵션은 이전 응용 프로그램을 마이그레이션 할 때 유용 할 수 있지만 새로운 응용 프로그램에서는 사용하지 마십시오!" Angular에 대한 원래 코멘트

    app.config ([ '$ controllerProvider', function ($ controllerProvider) {$ controllerProvider.allowGlobals ();}]);

  2. 컨트롤러 등록의 잘못된 생성자

전에

LoginController.$inject = ['$rootScope', '$scope', '$location'];

지금

app.controller('LoginController', ['$rootScope', '$scope', '$location', LoginController]);

'app'은 app.js에서 왔습니다.

var MyApp = {};
var app = angular.module('MyApp ', ['app.services']);
var services = angular.module('app.services', ['ngResource', 'ngCookies', 'ngAnimate', 'ngRoute']);



Chrome을 사용하여 브라우저의 캐시라고합니다. 단순히 내 문제를 해결 한 검사 (요소)에서 "캐시 사용 안 함"을 선택하십시오.




Related