programing

Angularjs:오류: [ng:areq] 인수 'HomeController'가 함수가 아닙니다. 정의되지 않았습니다.

javaba 2023. 2. 11. 17:36
반응형

Angularjs:오류: [ng:areq] 인수 'HomeController'가 함수가 아닙니다. 정의되지 않았습니다.

이것은 angularjs를 사용하여 서비스 파일을 만들고 컨트롤러에 서비스를 추가하는 데모입니다.

데모에 두 가지 문제가 있습니다.

  • 는 나, 가, one, 가를 때 입니다.<script src="HomeController.js"> 전에<script src="MyService.js">에러가 됩니다.

오류: [ng:areq] 인수 'HomeController'가 함수가 아닙니다. 정의되지 않았습니다.

  • 또 하나는 제가 이 모든 걸었을 때<script src="MyService.js"> 전에<script src="HomeController.js">합니다.

오류: [$injector:unpr] 알 수 없는 공급자:My Service Provider <- My Service

출처:

★★Index.html:

<!DOCTYPE html>
<html >
    <head lang="en">…</head>
    <body ng-app="myApp">
        …
        <div ng-controller="HomeController">
            <div ng-repeat="item in hello">{{item.id + item.name}}</div>
        </div>

        <script src="Scripts/angular.js"></script>
        <script src="Scripts/angular-route.js"></script>

        <!-- App libs -->
        <script src="app/app.js"></script>    
        <script src="app/services/MyService.js"></script>
        <script src="app/controllers/HomeController.js"></script>
    </body>
</html>

★★HomeController.js:

(function(angular){
    'use strict';

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

    myApp.controller('HomeController',function($scope,MyService){    
        $scope.hello=[];
        $scope.hello = MyService.getHello();
    });
})(window.angular);

★★MyService.js:

(function(angular){
    'use strict';

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

    myApp.service('MyService', function () {
        var hello =[  {id:1,name:'cuong'},
            {id:2,name:'nguyen'}];
        this.getHello = function(){
            return hello;
        };
    });

})(window.angular);

그러면 새 모듈/앱이 생성됩니다.

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

이것으로 이미 작성된 모듈에 액세스 할 수 있습니다(두 번째 인수가 누락되어 있는 것에 주의해 주세요.

var myApp = angular.module('myApp');

두 스크립트 모두에서 첫 번째 접근 방식을 사용하기 때문에 기본적으로 이전에 작성한 모듈을 덮어씁니다.

로드되는에서는 " " " 를합니다.var myApp = angular.module('myApp');.

나는 이 오류를 한 번 경험했다.문제는 FILE_NAME_WHERE_를 추가하지 않았다는 것입니다.IS_MY_FUNTION.js

그래서 내 file.filename은 내 기능이 어디에 있는지 찾을 수 없었다.

file.js를 추가하면 문제가 해결됩니다.

<html ng-app='myApp'>
    <body ng-controller='TextController'>
    ....
    ....
    ....
    <script src="../file.js"></script>
    </body>
</html>

또한 body의 닫힘 태그 직전에 index.html의 맨 아래쪽에 있는 스크립트태그 내에 컨트롤러가 정의되어 있는지 확인합니다.

 <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/controllers/Administration.js"></script>
    <script src="scripts/controllers/Leaderboard.js"></script>
    <script src="scripts/controllers/Login.js"></script>
    <script src="scripts/controllers/registration.js"></script>

고객님의 특정 페이지, 특정 페이지, 특정 페이지 및 app.dispos 페이지에 모두 "model"(같은)이라고 표기되어 있으면 문제가 해결됩니다.

주사 목록과 기능 목록 사이에서 ""를 놓칠 때마다 몇 번인가 발생했습니다.

app.controller('commonCtrl', ['$scope', '$filter',function($scope,$filter) {

}]);

저도 이 오류가 발생했지만 컨트롤러 명명 규칙 때문입니다.는 선언을 했다.controller: "QuestionController".state에서는, 나는 을 「CHANDER」라고하고 있습니다.

yiiExamApp.controller('questionController' ...

하지만 그래야 한다.

yiiExamApp.controller('QuestionController' ...

이 바보 같은 실수 때문에 내가 그것을 확인하는 데 4시간을 허비했기 때문에 이 실수를 겪고 있는 사람들에게 도움이 되기를 바란다.

저도 같은 오류가 발생하여 메인 모듈 어레이에 자모듈을 포함시켰습니다.

var myApp = angular.module('myApp', ['ngRoute', 'childModuleName']);

만약 ALL ELSE가 실패하여 나처럼 MEAN 스택에서 로컬로 단숨에 실행된다면...그만하고 다시 서브하세요!저는 당신의 모든 게시물을 꼼꼼히 체크하고 있었는데, 간단히 꿀꺽 서브를 다시 할 때까지 소용이 없었습니다.

저도 같은 오류가 발생했어요.자바 스크립트를 이렇게 정의했습니다.

<script src="controllers/home.js" />

그래서 이걸로 바꿨어요.

<script src="controllers/home.js"></script>

그 후 나의 문제는 해결되었다.

저도 비슷한 문제가 있었어요.이 수정에서는 ctroller가 body의 닫힘 태그 직전에 index.html의 맨 아래에 있는 스크립트태그 내에서 정의되어 있을 뿐만 아니라 폴더 구조 순서에 따라 정의되어 있는지 검증할 수 있었습니다.

<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
<script src="scripts/controllers/Administration.js"></script>
<script src="scripts/controllers/Leaderboard.js"></script>
<script src="scripts/controllers/Login.js"></script>
<script src="scripts/controllers/registration.js"></script>

저도 프로젝트 중에 이런 문제가 있었습니다. 그, 능, 이, 이, 이, 재, 재, 재, it, it, it, it, it, it, it, it, it, it,my-controller.js 내 my에karma.conf.js 「」이 파일)<script>

이게 도움이 되길 바라.이 문제를 야기할 수 있는 많은 이유들이 있다.

저도 이 에러가 났어요.

라우팅 정보에 새 컨트롤러를 추가해야 했습니다.\src\display\app.displays

angular.module('Lillan', [
  'ngRoute',
  'mobile-angular-ui',
  'Lillan.controllers.Main'
])

컨트롤러를 추가했습니다.

angular.module('Lillan', [
  'ngRoute',
  'mobile-angular-ui',
  'Lillan.controllers.Main',
  'Lillan.controllers.Growth'
])

건배!

물론 이전 투고는 유용하지만, 제 경우에는 위의 어느 것도 도움이 되지 않습니다.원인은 스크립트 로드 순서가 올바르지 않기 때문입니다.예를 들어 컨트롤러 editCtrl.js는 ui-bootstrap-tpls.js에 의존하기 때문에 먼저 로드해야 합니다.이로 인해 다음 오류가 발생했습니다.

<script src="scripts/app/station/editCtrl.js"></script>
<script src="scripts/angular-ui/ui-bootstrap-tpls.js"></script>

이것이 맞습니다. 작동:

<script src="scripts/angular-ui/ui-bootstrap-tpls.js"></script>
<script src="scripts/app/station/editCtrl.js"></script>

따라서 오류를 수정하려면 먼저 종속성이 없는 모든 스크립트를 선언한 다음 이전에 선언한 스크립트에 의존하는 스크립트를 선언해야 합니다.

이거 드셔보세요

    <title>My First Angular App</title>

</head>

<body>

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

    <h3>Adding Simple Controller<h3>        

    <div ng-controller="SimpleController">
        Name:

        <br/>

        <input type = "text" data-ng-model = "name"/> {{name}}

        <br/>

        <ul>    
            <li data-ng-repeat = "cust in customers | filter:name | orderBy:'city'">
                {{cust.name}} - {{cust.city}}
            </li>
        </ul>

    </div>


    <script>

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

        angularApp.controller('SimpleController', [ '$scope', SimpleController]);

        function SimpleController($scope)
        {

            $scope.customers = [
                                    {name:'Nikhil Mahirrao', city:'Pune'},
                                    {name:'Kapil Mahire', city:'Pune'},
                                    {name:'Narendra Mahirrao', city:'Phophare'},
                                    {name:'Mithun More', city:'Shahada'}

                                ]; 
        }

    </script>

</body>

제 경우 html 파일에서 Angular 어플리케이션 이름이 누락되어 있었습니다.예를 들어, 저는 이 파일을 어플리케이션 코드의 선두에 포함시켰습니다.나는 그것이 운영되고 있다고 생각했지만, 그렇지 않았다.

app.displaces.displaces

(function () {
    'use strict';

    angular
        .module('app', [
        // Other dependencies here...
        ])
    ;

})();

그러나 html에서 앱을 선언했을 때 다음과 같이 되어 있었습니다.

index.displaces를 표시합니다.

<html lang="en" ng-app>

그러나 Angular 어플리케이션을 사용한 이름으로 참조하기 위해서는 다음을 사용해야 했습니다.

index.html(고정)

<html lang="en" ng-app="app">

앱에서 대응하는 모듈을 정의한 스크립트보다 먼저 컨트롤러 스크립트를 추가했기 때문에 오류가 발생하였습니다.먼저 스크립트를 추가합니다.

<script src = "(path of module.js file)"></script>

그 후 추가만 합니다.

<script src = "(path of controller.js file)"></script>

메인 파일 안에.

오류: ng:areq Bad Argument로 인해 대괄호를 너무 빨리 닫았기 때문에 여러 번 문제가 발생하였습니다.아래의 BAD 예에서는 실제로는 최종 부모보다 앞에 와야 하는 '$state' 뒤에 잘못 닫힙니다.

불량:

sampleApp.controller('sampleApp', ['$scope', '$state'], function($scope, $state){

});

좋은 점:

sampleApp.controller('sampleApp', ['$scope', '$state', function($scope, $state){

}]);

네. 이전에 많은 분들이 지적하셨듯이, 저는 index.html의 모든 컨트롤러 파일에 src 경로를 추가했습니다. 

<script src="controllers/home.js"></script>
<script src="controllers/detail.js"></script>
<script src="controllers/login.js"></script>
<script src="controllers/navbar.js"></script>
<script src="controllers/signup.js"></script>

이것으로 그 오류가 수정되었습니다.

저도 같은 문제가 있었습니다만, grunt/gulp 최소화 프로세스에 파일을 포함시키는 것을 잊었습니다. 

grunt.initConfig({
  uglify: {
    my_target: {
      files: {
        'dest/output.min.js': ['src/input1.js', 'src/missing_controller.js']
      }
    }
  }
});

도움이 됐으면 좋겠다.

이 에러는 어레이 인수 내에서 함수를 선언하지 않았을 때 표시됩니다.

오류가 있는 항목:

taskAppControllers.controller('MainMenuCtrl', []);

수정된 것:

taskAppControllers.controller('MainMenuCtrl', [function(){

}]);

철자 오류도 체크해 주세요.

var MyApp = angular.module('AppName',[]);
MyApp.controller('WRONG_SPELLING_MyCtrl', ['$scope', MyControllerCtrl])
function MyControllerCtrl($scope) {
   var vm = $scope;
   vm.Apple = 'Android';
}

<div ng-controller="ACTUAL_SPELLING_MyCtrl">
    {{Apple}}
</div>

HTML 페이지에 다음이 포함되어 있는지 확인합니다.

  1. angular.min대본
  2. app.js
  3. 컨트롤러 JavaScript 페이지

파일이 포함되는 순서가 중요합니다.그것은 이 문제에 대한 나의 해결책이었다.

이게 도움이 됐으면 좋겠다.

sampleApp.controller('sampleApp', ['$scope', '$state', function($scope, $state){

저도 마찬가지입니다.콤마 '는 함수를 통해 문제를 해결할 수 있었습니다.오류: ng:areq Bad Argument

컨트롤러 파일이 비어 있는 것으로 캐시되었습니다.캐시를 비우니까 고쳐졌어요

HomeController.js를 예상대로 직접 이동시켰습니다.원래 위치에 다시 놓는다.

그 후 제 웹사이트는 1초마다 자동으로 페이지가 로딩되기 시작했고, 저는 오류를 볼 수조차 없었습니다.그래서 브라우저 캐시를 지웠어요이것으로 문제가 해결되었다

저는 HomeController.js에서 선언된 함수 중 하나 뒤에 세미콜론을 추가하는 것이 해결책이었습니다.

//Corrected code is :
app.controller('HomeController', function($scope, $http, $log) {

  $scope.demo1 = function(){
      console.log("In demo");
  } //Here i forgot to add the semicolon
  
  $scope.demo2 = function(){
      console.log("In demo");
  };
  
});

언급URL : https://stackoverflow.com/questions/25895235/angularjs-error-ngareq-argument-homecontroller-is-not-a-function-got-und

반응형
저작자표시

'programing' 카테고리의 다른 글

앵귤러 바우어 설치에 적합한 버전을 찾을 수 없습니다.  (0) 2023.02.11
MongoDB: MongoDB 쉘에서 컬렉션의 모든 레코드를 삭제하는 방법  (0) 2023.02.11
React와 전단지를 결합하는 좋은 방법  (0) 2023.02.11
jQuery - 잘못된 호출  (0) 2023.02.11
ember.display 및 서버  (0) 2023.02.11

'programing'의 다른글

  • 현재글Angularjs:오류: [ng:areq] 인수 'HomeController'가 함수가 아닙니다. 정의되지 않았습니다.

관련글

댓글

티스토리툴바