角度控制器错误'参数'MainCtrl'不是函数，未定义'答案

【问题标题】：Angular Controller error 'Argument 'MainCtrl' is not a function, got undefined'角度控制器错误'参数'MainCtrl'不是函数，未定义'
【发布时间】：2014-12-12 23:58:25
【问题描述】：

今天下午的某个时候，我突然收到以下 AngularJS 错误：Argument 'MainCtrl' is not a function, got undefined

我有一个很好的版本仍在 Chrome 中运行，没有任何错误，所以我试图找到差异 - 但无济于事。

如果有任何关于如何修复错误Argument 'MainCtrl' is not a function, got undefined的建议，我将不胜感激

我在 index.html 中加载 controllers.js 文件 - 在正文部分：

 <!DOCTYPE html>
 <html ng-app="rage.ui">

 <head>
     <!-- loading css files here... -->
 </head>

 <body ng-controller="MainCtrl as main">

  <!-- Wrapper-->
  <div id="wrapper">
     <!-- Navigation -->
  </div>

  <script src="app/app.js"></script>
  <script src="app/config.js"></script>
  <script src="app/js/controllers.js"></script>

</body>

这是我的 controllers.js 文件中的 MainCtrl（也在 index.html 中加载） -

* MainCtrl - controller */

(function () {
 'use strict';
 angular.module('rage.ui')
    .controller('MainCtrl', ['$scope', '$interval', '$window', 'widgetDefinitions', main])
    .factory('widgetDefinitions', [widgetDefinitions])
    .value('defaultWidgets', [
    { name: 'random' },
    { name: 'time' },
    { name: 'datamodel' },
    {
        name: 'random',
        style: {
            width: '50%'
        }
    },
    {
        name: 'time',
        style: {
            width: '50%'
        }
    }
    ]);

function main($scope, $interval, $window, widgetDefinitions, defaultWidgets) {
    this.userName = 'Risk user';
    // ...
}
  function widgetDefinitions(RandomDataModel) {
    return [
      {
          name: 'random',
          directive: 'wt-scope-watch',
          attrs: {
              value: 'randomValue'
          }
      }
      {
          name: 'treegrid',
          templateUrl: 'app/views/templateGadget/treeGrid.html',
          title: "Tree Grid Report",
          attrs: {
              width: '50%',
              height: '250px'
          }
      }
    ];
  }

})();

在我尝试向 malhar Angular-Dashboard 框架添加新的“gadgetModelFactory”时，我破坏了我的系统。这是我的新工厂的好版本，现已修复：

'use strict';

angular.module('rage').
factory('gadgetDataModel', function ($scope, WidgetDataModel) {
function gadgetDataModel() {
    var test = 123;
}

gadgetDataModel.prototype = Object.create(WidgetDataModel.prototype);
gadgetDataModel.prototype.constructor = WidgetDataModel;

angular.extend(gadgetDataModel.prototype = {        
    init: function () {
        // to be overridden by subclasses
        var dataModelOptions = this.dataModelOptions;
    },

    destroy: function () {
        // to be overridden by subclasses
        WidgetDataModel.prototype.destroy.call(this);
        $interval.cancel(this.intervalPromise);
    }
});

});

还有我的 app.config：

(function () {
angular.module('rage.ui', [
    'ui.router',
    'ui.bootstrap',
    'ui.dashboard'
])
})();

【问题讨论】：

您认为 ng-app 在哪里？
@PSL - 我试图保持代码简洁明了，所以我无意中遗漏了 ng-app。请查看我修改后的 index.html，以及我的 app.js
把main改成vm所以MainCtrl改成vm，因为你的别名和你的函数不能一样。
@bob 没有发现您提供的代码有任何问题。 plnkr.co/edit/Y2kHhOclaKJVCZmiwHHA?p=preview 你在控制台中看到任何其他错误吗？你确定你的控制器文件已经加载了吗？
@bob 是的，我知道..这只是在示例中，并非真正用于现实生活中的用途..恕我直言，想象一下这种情况（这是最常见的）你有嵌套控制器你会给它们起什么名字？ vm1 vm2?它也将如此难以阅读，我相信他的示例更多地是将控制器实例附加到范围（在引入控制器之前）。但是我的观点在上面的评论中有所不同.. :)

标签： angularjs

【解决方案1】：

看看其他帖子 (AngularJS error: 'argument 'FirstCtrl' is not a function, got undefined')
检查您是否正确定义了 ng-app
检查是否在索引中正确列出了JS文件
尝试将控制器重写为更传统的方式（请参阅 egghead.io 教程）

【讨论】：

伙计们，原来我在 index.html 中加载了一个坏工厂。一旦我将其注释掉，我的页面就可以正常加载。请注意在我的原始帖子中注入的“gadgetDataModel”工厂。

【解决方案2】：

也许您有两个具有相同模块名称的 .js 文件。例如：

file1.js：

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

file2.js：

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

【讨论】：