Ошибка: аргумент не является функцией, получено значение undefined

120

Используя AngularJS со Scala Play, я получаю эту ошибку.

Ошибка: аргумент MainCtrl не является функцией, получено значение undefined

Я пытаюсь создать таблицу, состоящую из дней недели.

Пожалуйста, взгляните на мой код. Я проверил имя контроллера, но это кажется правильным. Примечание: код, использованный в этом 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"]
        }
    });
}());
Кевин Мередит
источник
15
В html, где вы использовали, ng-appможете ли вы изменить его наng-app=myApp
Chandermani
Получил ту же ошибку @Chandermani
Кевин Мередит
Вы пробовали удалить замыкание (IIFE) из кода? Когда у меня возникла эта проблема, это произошло из-за ошибки PHP в моем javascript.
Кевин Бил
1
Вы можете выяснить свою проблему с помощью этого контрольного списка: stackoverflow.com/a/26797874/930170
Сергей Панфилов
Подтвердите, добавили ли вы MainCtrl.controller.js в файл BundleConfig.cs
Сайед Мохамед

Ответы:

107

Удалите []из имени ([myApp]) модуля

angular.module('myApp', [])

И добавьте ng-app="myApp"в html, и он должен работать.

Chandermani
источник
1
Все, что мне нужно было сделать, чтобы он заработал, - это второе предложение (т.е. установить ng-app = "myApp"). Если я удалил [], я получил другую ошибку.
Джейсон
15
Наличие второго параметра []означает, что вы создаете новый модуль. Удаление второго параметра означает, что вы извлекаете существующий модуль. Таким образом, одна из возможностей проверить - это то, что вы звоните angular.moduleдважды, оба раза включая второй параметр. Если это так, то более позднее вхождение перезапишет второе, скрыв все определения контроллеров до этого момента.
Carl G
26
Когда он говорит об удалении, []он имеет в виду первый параметр, в котором OP [myApp]вместо myApp. Он не говорит о втором параметре.
Кевин Бил,
1
Проверьте имя вашего контроллера, если вы используете маршруты. Имя контроллера в определении маршрута чувствительно к регистру.
Latin Warrior
78

ПЕРВЫЙ. проверьте правильность 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>

pleerock
источник
30
По моему опыту, ваша «секунда» всегда является проблемой. Я часто забываю импортировать свои контроллеры вindex.html
msanford
В моем случае это был второй, забыл импортировать файл JS ...
Саураб Мишра,
26

У меня было такое же сообщение об ошибке (в моем случае: «Аргумент 'languageSelectorCtrl' не является функцией, получено не определено»).

После утомительного сравнения с исходным кодом Angular я обнаружил, что ранее удалил ссылку на модуль контроллеров в 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 снова смог создать экземпляры контроллеров.

Бертран
источник
была та же проблема, моя проблема заключалась в том, что я забыл добавить свой контроллер в модуль приложения ... почему это не происходит автоматически ??? все равно спасибо!
TheZuck
16

Иногда эта ошибка является результатом двух ng-app директив, указанных в html. В моем случае по ошибке я указал ng-appв своем htmlтеге и ng-app="myApp"в bodyтеге вот так:

<html ng-app>
  <body ng-app="myApp"></body>
</html>
Gaurav
источник
1
Это случилось со мной, когда я не добавил инъекцию в модуль myApp.
Ghandhikus
Спасибо! Это устранило мою проблему.
bradden_gross
6

Это серьезно заняло у меня 4 ЧАСА (включая бесконечные поиски на SO), но, наконец, я нашел его: по ошибке (непреднамеренно) я где-то добавил пробел.

Вы можете это заметить?

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

Итак ... 4 часа спустя я увидел, что должно быть:

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

Практически невозможно увидеть невооруженным глазом.

Это подчеркивает жизненно важную важность контроля версий (git или что-то еще) и модульного / регрессионного тестирования.

Лео
источник
1
Мой ответ не был лишним, но он привел меня к моему исправлению. У меня было Controllerвместо, controllerи это все, что потребовалось.
Grandizer
И я назвал свой файл options-moda.controller.js, но искал options-modal.controller.js DOH!
theFish
Моя была из-за того, что я забыл добавить .js в BundleConfig. Просто, но разочаровывающе.
Эге Байрак
4

Я столкнулся с той же проблемой, и в моем случае это произошло в результате этой проблемы:

У меня были контроллеры, определенные в отдельном модуле (называемом myApp.controllers) и введенные в основной модуль приложения (называемый myApp) следующим образом:

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

Коллега поместил другой модуль контроллера в отдельный файл, но с тем же именем, что и мое (например, «myApp.controllers»), что вызвало эту ошибку. Я думаю, потому что Angular запутался между этими модулями контроллера. Однако сообщение об ошибке не очень помогло определить, что происходит не так.

Лилла Эли
источник
1
Это должно быть исправлено путем удаления второго параметра в модуле ... Чтобы получить существующий модуль, используя angular.module ('myApp') без второго параметра. т.е. angular.module ('myApp'). contoller (...)
Сантош
3

В моем случае (имея страницу обзора и страницу «добавить») я получил это с помощью настройки маршрутизации, как показано ниже. Он выдавал сообщение для 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, но его контроллера нигде не было.

Удаление '/' - маршрута, когда случай устранил эту проблему для меня.

EeKay
источник
Я также получал эту ошибку и рвал волосы, потому что это приводило к сбою моих сборок TFS. Комментирование маршрута '/' исправило это и для меня. Теперь выясним почему!
Филипп Копли,
3

Если вы находитесь в подмодуле, не забудьте объявить модуль в основном приложении. то есть:

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

Если вы не объявите subModule1 в mainApp, вы получите «[ng: areq] Аргумент« MyController »не является функцией, получено значение undefined.

syjust
источник
2

Второй пункт Умеда был моей ловушкой, но для протокола, может, он кому-то где-то помогает:

У меня была та же проблема, и незадолго до того, как я сходил с ума, я обнаружил, что забыл включить свой скрипт контроллера.

Поскольку мое приложение основано на ASP.Net MVC, я решил сохранить рассудок, вставив следующий фрагмент в свой App_Start / BundleConfig.cs

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

и в Layout.cshtml

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

Теперь мне больше не придется думать о включении файлов вручную. Оглядываясь назад, я действительно должен был сделать это при настройке проекта ...

Xceno
источник
1

Я получил нормальную ошибку с LoginController, которую я использовал в основном index.html. Я нашел два пути решения:

  1. установив $ controllerProvider.allowGlobals (), я нашел этот комментарий в списке изменений Angular «Эта опция может быть удобна для переноса старых приложений, но, пожалуйста, не используйте ее в новых!» оригинальный комментарий к Angular

    app.config (['$ controllerProvider', функция ($ controllerProvider) {$ controllerProvider.allowGlobals ();}]);

  2. неправильный конструктор регистрирующего контроллера

перед

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

сейчас

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

'приложение' происходит из app.js

var MyApp = {};
var app = angular.module('MyApp ', ['app.services']);
var services = angular.module('app.services', ['ngResource', 'ngCookies', 'ngAnimate', 'ngRoute']);
Дмитрий Алгазин
источник
1

У меня была такая же ошибка с большой ошибкой:

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

}]);

Ты видишь ? я забыл '' вокруг первой $ scope, правильный синтаксис, конечно же:

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

}]);

Первая ошибка, которую я не заметил сразу, была: « $ scope не определена », за которой следует « Ошибка: [ng: areq] Аргумент 'TreeEditStepControlsCtrl' не является функцией, получено значение не определено »

Elo
источник
0

Может ли это быть так же просто, как заключить ваш актив в "" и все, что требует кавычек внутри, с ""?

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

становится

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

Это могло вызвать некоторые проблемы с синтаксическим анализом

Джей Том
источник
0

Чтобы решить эту проблему, мне пришлось обнаружить, что я неправильно написал имя контроллера в объявлении маршрутов Angular:

.when('/todo',{
            templateUrl: 'partials/todo.html',
            controller: 'TodoCtrl'
        })
MadPhysicist
источник
0

В моем случае это была простая опечатка index.html:

<script src="assets/javascript/controllers/questionssIndexController.js"></script>

это должно было быть

<script src="assets/javascript/controllers/questionsIndexController.js"></script>

без лишних слов sв имени контроллера.

Эдди
источник
0

Оказывается, это кеш браузера, использующего здесь Chrome. Просто проверьте «Отключить кеш» в разделе «Проверить (элемент), решивший мою проблему».

Вэйхуэй Го
источник
0

Потому что это всплывает в Google при попытке найти ответ на: «Ошибка: аргумент» не является функцией, получено значение undefined ».

Возможно, вы дважды пытаетесь создать один и тот же модуль.

Angular.module - это глобальное место для создания, регистрации и извлечения модулей AngularJS.

Передача одного аргумента возвращает существующий angular.Module, тогда как передача более одного аргумента создает новый angular.Module

Источник: https://docs.angularjs.org/api/ng/function/angular.module#overview

Пример:

angular.module('myApp', []) Используется для создания модуля без внедрения каких-либо зависимостей.

angular.module('myApp') (Без аргумента) используется для получения существующего модуля.

MCollard
источник
0

Кажется, есть много рабочих решений, предполагающих, что ошибка имеет много реальных причин .

В моем случае я не объявил контроллер в app/index.html:

<scipt src="src/controllers/controller-name.controller.js"></script>

Ошибка исчезла.

Тай Конвей
источник