it-swarm.com.de

Fehler: Argument ist keine Funktion, undefiniert

Bei Verwendung von AngularJS mit Scala Play erhalte ich diesen Fehler.

Fehler: Das Argument 'MainCtrl' ist keine Funktion und wurde undefiniert

Ich versuche, eine Tabelle zu erstellen, die aus den Wochentagen besteht.

Bitte schauen Sie sich meinen Code an. Ich hatte den Namen des Controllers überprüft, aber das scheint richtig zu sein. Hinweis: Code, der von diesem SO answer verwendet wird.

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"]
        }
    });
}());
118
Kevin Meredith

Entfernen Sie den [] aus dem Namen ([myApp]) des Moduls

angular.module('myApp', [])

Und fügen Sie ng-app="myApp" zur HTML hinzu und es sollte funktionieren.

105
Chandermani

ZUERST. Prüfen Sie, ob Sie in den Routendefinitionen die richtige controller angegeben haben, genau wie die von Ihnen definierten Controller-Namen 

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';
    }]);

unterschiedliche Controller-Namen in diesem Beispiel führen zu Fehlern. Dieses Beispiel ist jedoch korrekt

SEKUNDEÜberprüfen Sie, ob Sie Ihre Javascript-Datei importiert haben:

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

77
pleerock

Ich hatte die gleiche Fehlermeldung (in meinem Fall: "Argument 'languageSelectorCtrl' ist keine Funktion, wurde undefiniert").

Nach einem langwierigen Vergleich mit dem Code von Angular seed stellte ich fest, dass ich zuvor einen Verweis auf das Controllermodul in app.js entfernt hatte. (Stelle es auf https://github.com/angular/angular-seed/blob/master/app/js/app.js )

Also hatte ich folgendes:

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

Dies ist fehlgeschlagen.

Und als ich den fehlenden Verweis hinzufügte:

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

Die Fehlermeldung verschwand und Angular konnte die Controller erneut instanziieren.

26
bertrand

Manchmal ist dieser Fehler das Ergebnis von two ng-app-Direktiven, die in html ..__ angegeben sind. In meinem Fall hatte ich versehentlich ng-app in meinem html-Tag und ng-app="myApp" im body-Tag folgendermaßen angegeben:

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

Das hat mich 4 STUNDEN (einschließlich endloser Suche nach SO) ernst genommen, aber schließlich habe ich es gefunden: aus Versehen (ungewollt) habe ich irgendwo ein Leerzeichen hinzugefügt.

Kannst du es erkennen?

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

Also ... 4 Stunden später sah ich, dass es sein sollte:

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

Mit bloßem Auge kaum zu sehen.

Dies unterstreicht die entscheidende Bedeutung von Revision Control (Git oder was auch immer) und Unit/Regression-Tests.

6
leo

Ich bin auf das gleiche Problem gestoßen und in meinem Fall geschah es als Folge dieses Problems:

Ich hatte die Controller in einem separaten Modul ("myApp.controllers") definiert und in das Haupt-App-Modul ("myApp") eingefügt:

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

Ein Kollege hat ein anderes Controller-Modul in eine separate Datei geschrieben, aber mit demselben Namen wie meinem (d. H. 'MyApp.controllers'), was diesen Fehler verursacht hat. Ich denke, weil Angular zwischen diesen Controller-Modulen verwirrt wurde. Die Fehlermeldung war jedoch nicht sehr hilfreich, um herauszufinden, was falsch läuft.

4
Lilla Eli

In meinem Fall (mit einer Übersichtsseite und einer "Hinzufügen" -Seite) habe ich dies mit meinem Routing-Setup wie folgt erhalten. Es wurde die Nachricht für die AddCtrl gegeben, die nicht injiziert werden konnte ...

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

Aufgrund der when('/'-Route wurden alle meine Routen in der Übersicht angezeigt, und der Controller konnte auf der/add-Routenseitenrendering nicht abgeglichen werden. Dies war verwirrend, da ich DID die Vorlage add.html sehe, aber der Controller war nirgends zu finden.

Das Entfernen der '/' - Route, wenn der Fall dieses Problem für mich behoben hat.

3
EeKay

Wenn Sie sich in einem Submodul befinden, vergessen Sie nicht, das Modul in der Hauptanwendung ..__ zu deklarieren. 

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

Wenn Sie subModule1 nicht in mainApp deklarieren, erhalten Sie ein "[ng: areq] Argument" MyController "ist keine Funktion, wurde undefiniert.

2
syjust

Der zweite Punkt von Уmed war meine Falle, aber nur fürs Protokoll, vielleicht hilft es jemandem irgendwo:

Ich hatte das gleiche Problem und kurz bevor ich verrückt wurde, entdeckte ich, dass ich vergessen hatte, mein Controller-Skript einzuschließen.

Da meine App auf ASP.Net MVC basiert, habe ich mich entschlossen, mich durch Einfügen des folgenden Ausschnitts in meine App_Start/BundleConfig.cs

bundles.Add(new ScriptBundle("~/app").Include(
                "~/app/app.js",
                "~/app/controllers/*.js",
                "~/app/services/*.js" ));

und in Layout.cshtml

<head>
...
   @Scripts.Render("~/app")
...
</head>

Jetzt muss ich nicht mehr daran denken, die Dateien manuell einzubinden ... In Rücksicht hätte ich das wirklich tun sollen, wenn ich das Projekt aufbaue ...

2
Xceno

Bei LoginController, das ich in main index.html ..__ verwendet habe, ist ein Fehler aufgetreten. Ich habe zwei Möglichkeiten gefunden, diese zu lösen:

  1. wenn ich $ controllerProvider.allowGlobals () setze, fand ich diesen Kommentar in Angular change-list "Diese Option kann für die Migration alter Apps nützlich sein, aber bitte nicht in neuen verwenden!" ursprünglicher Kommentar zu Angular

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

  2. falscher Konstruktor beim Registrieren des Controllers

vor

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

jetzt

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

'app' kommt von app.js

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

Ich hatte den gleichen Fehler mit einem großen Fehler:

appFormid.controller('TreeEditStepControlsCtrl', [$scope, function($scope){

}]);

Siehst du? Ich habe das '' um den ersten $ scope vergessen, die richtige Syntax ist natürlich:

appFormid.controller('TreeEditStepControlsCtrl', ['$scope', function($scope){

}]);

Ein erster Fehler, den ich nicht sofort sah, war: " $ scope ist nicht definiert ", gefolgt von " Fehler: [ng: areq] Argument 'TreeEditStepControlsCtrl' ist keine Funktion, wurde undefined "

1
Elo

Um dieses Problem zu beheben, musste ich feststellen, dass ich den Namen des Controllers in der Erklärung der Angular-Routen falsch geschrieben hatte:

.when('/todo',{
            templateUrl: 'partials/todo.html',
            controller: 'TodoCtrl'
        })
0
MadPhysicist

Könnte es so einfach sein, Ihr Asset in "" einzuschließen und die Zitate im Inneren mit "" zu kennzeichnen?

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

wird

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

Das könnte Probleme beim Parsen verursachen

0
Jay Tom

Es stellt sich heraus, dass es der Cache des Browsers ist, der hier Chrome verwendet. Überprüfen Sie einfach das Kontrollkästchen "Cache deaktivieren" unter Inspect (Element), um mein Problem zu beheben.

0
kakugiki