it-swarm.com.de

Angularjs: Fehler: [ng: areq] Argument 'HomeController' ist keine Funktion und wurde undefiniert

Dies ist meine Demo mit "anglejs" zum Erstellen einer Servicedatei und zum Hinzufügen eines Services zu einem Controller.

Ich habe zwei Probleme mit meiner Demo:

  • Eine ist, wenn ich <script src="HomeController.js"> vor <script src="MyService.js"> stelle, bekomme ich diese Fehlermeldung,

Fehler: [ng: areq] Argument 'HomeController' ist keine Funktion, undefiniert

  • Die andere ist, wenn ich <script src="MyService.js"> vor <script src="HomeController.js"> stelle, erhalte ich folgende Fehlermeldung

Fehler: [$ injector: unpr] Unbekannter Anbieter: MyServiceProvider <- MyService

Meine Quelle:

Datei 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>

Datei 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);

Datei 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);
103
Cuong.Ho

Dadurch wird ein neues Modul/eine neue App erstellt:

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

Während dieses auf ein bereits erstelltes Modul zugreift ( das Auslassen des zweiten Arguments beachten):

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

Da Sie den ersten Ansatz für beide Skripts verwenden, überschreiben Sie grundsätzlich das zuvor erstellte Modul.

Verwenden Sie im zweiten geladenen Skript var myApp = angular.module('myApp');.

207
bmleite

Ich habe diesen Fehler einmal erlebt. Mein Problem war, dass ich nicht die Datei FILE_NAME_WHERE_IS_MY_FUNCTION.js hinzugefügt habe  

so fand meine file.html nie, wo meine Funktion war

Nachdem ich "file.js" hinzugefügt habe, habe ich das Problem behoben

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

Stellen Sie außerdem sicher, dass Ihre Controller innerhalb der Skript-Tags am Ende Ihrer index.html definiert sind, kurz vor dem schließenden Tag für body.

 <!-- 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>

vorausgesetzt, alles wird auf den Seiten "Specific.html", "Specific.js" und "App.js" (gleich) korrekt geschrieben ("dasselbe"). Dies sollte Ihr Problem beheben.

20
AA11oAKas

Ist mir ein paar Mal passiert, wenn ich "," zwischen Injektionsliste und Funktion vermisse

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

}]);
9
jprism

Ich habe diesen Fehler auch erlebt, aber in meinem Fall lag dies an der Namenskonvention der Controller. Ich habe controller: "QuestionController" in .state deklariert, aber in der Controller-Definition habe ich es gerne erklärt 

yiiExamApp.controller('questionController' ...

aber es sollte sein

yiiExamApp.controller('QuestionController' ...

ich hoffe, das hilft den Leuten, die mit diesem Fehler konfrontiert werden, wegen dieses dummen Fehlers, den ich 4 Stunden bei der Identifizierung verschwendet habe.

5
Kuldeep Dangi

Ich bin auch auf diesen Fehler gestoßen und der Fix bestand für mich darin, mein Kindermodul in das Hauptmodul-Array aufzunehmen.

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

Wenn ALL ELSE ausfällt und Sie lokal auf dem MEAN-Stack laufen, wie ich mit Schlucke ... einfach aufhören und erneut servieren! Ich holte mein Hören heraus und überprüfte alles von all Ihren Posts ahnungslos, bis ich einfach noch einmal Schluckaufschlag lief.

4
sigmapi13

Ich habe den gleichen Fehler bekommen. Ich habe Java-Skript so definiert

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

dann habe ich das geändert

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

Danach ist mein Problem gelöst.

4
Damith Ganegoda

Dieses Problem ist mir auch in meinem Projekt begegnet. Nach dem Einfügen des my-controller.js in meine karma.conf.js-Datei mit dem <script>-Tag funktionierte es schließlich.

Hoffe das wird helfen. Es gibt viele Gründe, die zu diesem Problem führen können.

2
sosostris

In meinem Fall fehlte mir der Name der Angular-Anwendung in der HTML-Datei. Zum Beispiel hatte ich diese Datei als Start für meinen Anwendungscode hinzugefügt. Ich hatte angenommen, dass es gerannt wurde, aber es war nicht so.

app.module.js

(function () {
    'use strict';

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

})();

Als ich die App in der HTML-Datei deklarierte, hatte ich Folgendes:

index.html

<html lang="en" ng-app>

Um die Angular-Anwendung mit dem von mir verwendeten Namen zu referenzieren, musste ich Folgendes verwenden:

index.html (Fixed)

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

Ich habe den Fehler erhalten, weil ich das Controller-Skript vor dem Skript hinzugefügt hatte, in dem das entsprechende Modul in der App definiert war .. __ Fügen Sie zuerst das Skript hinzu

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

Dann nur noch hinzufügen

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

In der Hauptdatei.

1
user2470087

Ich habe auch diesen Fehler erhalten. 

Ich musste meinen neuen Controller zu den Routing-Informationen hinzufügen. \src\js\app.js

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

Ich habe meinen Controller hinzugefügt, damit er aussieht 

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

Prost!

1
zaini

Versuche dies

 

    <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>

1
Nikhil Mahirrao

Offensichtlich sind vorherige Beiträge nützlich, aber in meinem Fall sind alle oben genannten nicht hilfreich. Der Grund war in falsche Reihenfolge beim Laden von Skripten . In meinem Fall zum Beispiel hängt der Controller editCtrl.js von ui-bootstrap-tpls.js ab (verwendet) und sollte daher zuerst geladen werden .. __ Dies verursacht einen Fehler:

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

Das ist richtig, funktioniert:

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

Um den Fehler zu beheben, müssen Sie zuerst alle Skripts ohne Abhängigkeiten deklarieren und dann Skripts, die von den zuvor deklarierten abhängig sind. 

1
Sergey Kulgan

Ich hatte ein ähnliches Problem. Das Update war sichergestellt, dass Ihre Steuerungen nicht nur in Skript-Tags am Ende Ihrer index.html kurz vor dem schließenden Tag für body definiert sind, sondern auch, dass sie in der Reihenfolge ihres Ordnerordners überprüfen.

<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>
1
Maurizio L

Fehler: ng: areq Bad Argument hat mich ein paar Mal bekommen, weil ich die eckige Klammer zu früh schließe. Im nachstehenden BAD-Beispiel wird es nach '$ state' falsch geschlossen, wenn es tatsächlich vor dem letzten Parenthese gehen sollte. 

SCHLECHT:

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

});

GUT:

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

}]);
1
foldinglettuce
sampleApp.controller('sampleApp', ['$scope', '$state', function($scope, $state){

Gleiches für mich, Komma ',' vor der Funktion hat mir bei der Behebung des Problems geholfen - Fehler: ng: areq Bad Argument

0
fixit

Prüfen Sie, ob Ihre HTML-Seite Folgendes enthält: 

  1. angular.min-Skript
  2. app.js 
  3. controller-JavaScript-Seite 

Die Reihenfolge, in der die Dateien enthalten sind, ist wichtig. Es war meine Lösung für dieses Problem.

Hoffe das hilft.

0

Überprüfen Sie auch auf Rechtschreibfehler .

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>
0
Mahesh

Ich habe versehentlich meine HomeController.js aus der direkt herausgezogen, wo sie erwartet wurde. Wieder an den ursprünglichen Ort setzen.

Danach begann meine Website jede Sekunde automatisch, die Seiten automatisch zu laden. Ich konnte den Fehler sogar nicht mehr erkennen. Also habe ich den Browser-Cache gelöscht. Es hat das Problem gelöst

0
Charlie

Ja. Wie viele bereits erwähnt haben, Ich habe den src-Pfad zu allen Controller-Dateien in der index.html hinzugefügt. 

<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>

Dieser Fehler wurde behoben. 

0
obscure79

Ich hatte das gleiche Problem, aber ich habe vergessen, die Datei in den Grunt/Gulp-Minimierungsprozess aufzunehmen. 

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

Hoffentlich hilft das.

0
Patrik Bego

In meiner Situation trat dieser Fehler auf, wenn ich innerhalb eines Array-Arguments keine Funktion deklarierte. 

Der mit Fehler :

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

Der feste:

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

}]);
0
Kunok

Meine Controller-Datei wurde als leer zwischengespeichert. Das Löschen des Cache löste es für mich.

0
Priyank