Как найти причину AngularJS "Аргумент" MyCtrl "не является функцией, получил undefined"

Когда AngularJS выходит из строя с ошибкой " Аргумент" MyCtrl "не является функцией, получил undefined", может быть немного сложно найти причину, почему.

Здесь я хочу сделать своего рода "контрольный список", что вы должны проверить при получении ошибки

Ответы

Ответ 1

  • Файл с 'MyCtrl' связан через html? (проверьте дважды, если вы выполнили или угадали ваши файлы).
<script src='path/to/controllers.js'></script>
  1. Правильно ли указан MyCtrl?

Есть несколько шаблонов:

app.controller('MyCtrl', ['$scope', function ($scope) {...}])

app.controller('MyCtrl', function ($scope) {...})

var MyCtrl = function ($scope) {...})
  1. Определен ли "MyCtrl" в правом модуле?
  2. Добавлен ли модуль "MyCtrl" в зависимости от приложения?
angular.module('app', ['app.sources']);

  1. Если вы определяете свой модуль несколько раз, вы должны определить его в этом порядке:

    • Первое определение должно быть как
angular.module('app.sources', []);

(с [ ])

  • Последующие определения должны быть похожи на
angular.module('app.sources');

(без [ ])

Важно. Важно отметить, что порядок объявлений важен. Определение должно начинаться с [ ].

  1. Убедитесь, что модуль определен только один раз. Возможно, вы забыли переименовать модуль после копирования-вставки. Проверьте src для строки, например
angular.module('app.sources', []);

  1. Проверьте 'ng-app'. Лучше использовать только один из них с именем типа ng-app='app' (другими словами, не определяйте несколько неназванных директив ngApp)

  2. Является ли ваш синтаксис контроллера правильным для вашей версии AngularJS?

(Существует разница между определением в Angular 1.0.x и 1.2.x и выше. С версиями Angular больше 1.3. x, вы не можете объявить глобальную конструкторскую функцию и использовать ее с ng-контроллером)

Ответ 2

Если вы используете ng-controller с синтаксисом "контроллер как", обязательно проверьте правильность имени контроллера.

Мой случай:

//controller register    
angular.module("myApp").controller("someController", SomeController)

//in my code
<div ng-controller="SomeController as vm"></div>

Обратите внимание, что я использовал ng-controller="SomeController as vm", где SomeController имеет капитал S. Это должно было быть с нижним регистром S, потому что я зарегистрировал его.

Итак, проверьте правильность имени вашего контроллера.