错误:来自angular度控制器的
这是一个远射,但有没有人看过这个错误? 我正在尝试使用express,angular和mongoDB来添加“Transporters”。 每次访问由运输者控制器统治的页面时,都会收到此错误消息:
Error: [ng:areq] http://errors.angularjs.org/1.2.12/ng/areq?p0=TransportersController&p1=not%20aNaNunction%2C%20got%20undefined at Error (native) at http://localhost:3000/lib/angular/angular.min.js:6:450 at tb (http://localhost:3000/lib/angular/angular.min.js:18:360) at Pa (http://localhost:3000/lib/angular/angular.min.js:18:447) at http://localhost:3000/lib/angular/angular.min.js:62:17 at http://localhost:3000/lib/angular/angular.min.js:49:43 at q (http://localhost:3000/lib/angular/angular.min.js:7:386) at H (http://localhost:3000/lib/angular/angular.min.js:48:406) at f (http://localhost:3000/lib/angular/angular.min.js:42:399) at http://localhost:3000/lib/angular/angular.min.js:42:67
运输车控制器看起来像这样:
'use strict'; angular.module('mean.transporters').controller('TransportersController', ['$scope', '$routeParams', '$location', 'Global', 'Transporters', function ($scope, $routeParams, $location, Global, Transporters) { $scope.global = Global; $scope.create = function() { var transporter = new Transporters({ name: this.name, natl_id: this.natl_id, phone: this.phone }); transporter.$save(function(response) { $location.path('transporters/' + response._id); }); this.title = ''; this.content = ''; }; $scope.remove = function(transporter) { if (transporter) { transporter.$remove(); for (var i in $scope.transporters) { if ($scope.transporters[i] === transporter) { $scope.transporters.splice(i, 1); } } } else { $scope.transporter.$remove(); $location.path('transporters'); } }; $scope.update = function() { var transporter = $scope.transporter; if (!transporter.updated) { transporter.updated = []; } transporter.updated.push(new Date().getTime()); transporter.$update(function() { $location.path('transporters/' + transporter._id); }); }; $scope.find = function() { Transporters.query(function(transporters) { $scope.transporters = transporters; }); }; $scope.findOne = function() { Transporters.get({ transporterId: $routeParams.transporterId }, function(transporter) { $scope.transporter = transporter; }); }; }]);
在我看来,我打电话给列表并创build方法。 他们产生上述错误
我从ng文件中得到了这个:areq虽然仍然无法确定是怎么回事
AngularJS经常断言某些值将会出现,并且使用辅助函数真实。 如果断言失败,则抛出此错误。 要解决这个问题,确保断言期望的值被定义和真实。
以下是调用controller public/views/transporters/list.html
:
<section data-ng-controller="TransportersController" data-ng-init="find()"> <ul class="transporters unstyled"> <li data-ng-repeat="transporter in transporters"> <span>{{transporter.created | date:'medium'}}</span> / <h2><a data-ng-href="#!/transporters/{{transporter._id}}">{{transporter.name}}</a></h2> <div>{{transporter.natl_id}}</div> <div>{{transporter.phone}}</div> </li> </ul> <h1 data-ng-hide="!transporters || transporters.length">No transporters yet. <br> Why don't you <a href="/#!/transporters/create">Create One</a>?</h1> </section>
运输商服务代码:
angular.module('transporterService', []) .factory('Transporter', ['$http', function($http){ // all return promise objects return { get: function(){ return $http.get('/api/transporters'); }, create: function(transporterData){ return $http.post('/api/transporters', transporterData); }, delete: function(id){ return $http.delete('/api/transporters/'+id); } }; }]);
我曾经遇到过这个错误。 问题是我已经定义angular.module()在两个不同参数的地方。
例如:
var MyApp = angular.module('MyApp', []);
在其他地方,
var MyApp2 = angular.module('MyApp', ['ngAnimate']);
我得到了这个错误两次:
1)当我写道:
var app = module('flapperNews', []);
代替:
var app = angular.module('flapperNews', []);
2)当我复制并粘贴一些HTML,并在HTML中的控制器名称不完全匹配我的app.js文件中的控制器名称,例如:
index.html的:
<script src="app.js"></script> ... ... <body ng-app="flapperNews" ng-controller="MainCtrl">
app.js:
var app = angular.module('flapperNews', []); app.controller('MyCtrl', ....
在html中,控制器名称是“MainCtrl”,在js中我使用了名称“MyCtrl”。
实际上在错误url中embedded了一条错误消息:
错误:[ng:areq] http://errors.angularjs.org/1.3.2/ng/areq?p0= MainCtrl &p1 = not %20 a %20 function %2C%20 got %20 undefined
这里没有象形文字:
MainCtrl不是一个函数没有定义
换句话说,“没有名为MainCtrl的函数,请检查您的拼写。”
当我在Angular控制器中定义模块时遇到了这个问题,但却忽略了在我的HTML文件中设置应用程序名称。 例如:
<html ng-app>
而不是正确的:
<html ng-app="myApp">
当我定义如下的东西时:
angular.module('myApp', []).controller(...
并在我的HTML文件中引用它。
你忘了在你的index.html中包含控制器。 控制器不存在。
<script src="js/controllers/Controller.js"></script>
我有同样的错误,问题是我没有注入在主应用程序中的新模块
var app = angular.module("geo", []); ... angular .module('myApp', [ 'ui.router', 'ngResource', 'photos', 'geo' //was missing ])
检查你的angular度模块的名字…你的app.js中模块的名字是什么?
在你的TransportersController中,你有:
angular.module('mean.transporters')
并在您的TransportersService中拥有:
angular.module('transporterService', [])
你可能想引用每个模块:
angular.module('myApp')
我也有这个错误,我改变了这样的代码,然后它的工作。
HTML
<html ng-app="app"> <div ng-controller="firstCtrl"> ... </div> </html>
app.js
(function(){ var app = angular.module('app',[]); app.controller('firstCtrl',function($scope){ ... }) })();
您必须确保模块中的名称与ng-app相同
那么div将在firstCtrl的范围内
同样的问题发生在我身上,但我的问题是,我没有添加FILE_NAME_WHERE_IS_MY_FUNCTION.js
所以我的file.html从来没有find我的function在哪里
一旦我添加“file.js”我解决了这个问题
<html ng-app='myApp'> <body ng-controller='TextController'> .... .... .... <script src="../file.js"></script> </body> </html>
🙂
当控制器名称不一样(区分大小写!)时,我遇到了这个错误:
.controller('mainCOntroller', ... // notice CO
并在视图中
<div class="container" ng-controller="mainController"> <!-- notice Co -->
当我在路由中包含整个控制器文件名时,我得到了同样的错误:
app.config(function($routeProvider) { $routeProvider .when('/', { templateUrl: 'home.html', controller: 'mainController.js' }) .when('/portfolio', { templateUrl: 'portfolio.html', controller: 'mainController.js' }) });
当它应该是
app.config(function($routeProvider) { $routeProvider .when('/', { templateUrl: 'home.html', controller: 'mainController' }) .when('/portfolio', { templateUrl: 'portfolio.html', controller: 'mainController' }) });
Angular需要一些你喜欢的应用程序和控制器的名称,并在指令和应用程序中对它们进行说明,注意一致地命名所有内容,并在debugging时检查
当我在同一页面中有多个angular度模块时,这发生在我身上
我在使用部分视图时遇到了这个错误
一个部分的看法
<script src="~/Scripts/Items.js"></script> <div ng-app="SearchModule"> <div ng-controller="SearchSomething" class="col-md-1"> <input class="searchClass" type="text" placeholder="Search" /> </div> </div>
其他有
<div ng-app="FeaturedItems" ng-controller="featured"> <ul> <li ng-repeat="item in Items">{{item.Name}}</li> </ul> </div>
我有他们在不同的控制器相同的模块,并开始工作
我在与安全和login状态有关的演示应用程序中遇到了同样的错误。 其他的解决scheme都没有帮助,但只是打开一个新的匿名浏览器窗口的伎俩。
基本上,从以前版本的应用程序中放置了Cookie和令牌,这使得AngularJS处于一个不应该达到的状态。 因此, areq
断言失败。
还有另一种方式可能发生。
在我的应用程序中,我有一个主要模块,负责照顾路由器的状态pipe理,configuration和类似的东西。 实际function全部在其他模块中定义。
我已经定义了一个模块
angular.module('account', ['services']);
在其中有一个控制器“DashboardController”,但忘记了将其注入到我有一个引用DashboardController的状态的主模块中。
由于缺less注入,DashboardController不可用,所以抛出了这个错误。
在我的情况下,我包括控制器下面的app.js
,而app.js
应该包括任何控制器之上
<script src="js/app.js"></script> <script src="js/controllers/mainCtrl.js"></script>
除了在$ stateProvider中设置控制器之外,我完成了所有的工作。 我用文件名而不是variables名。
以下代码是错误的:
formApp.config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('management', { url: '/management', templateUrl: 'Views/management.html', controller: 'Controllers/ManagementController.js' });
这是正确的做法;
formApp.config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('management', { url: '/management', templateUrl: 'Views/management.html', controller: 'ManagementController' });
确保你注意到了;
控制器:'ManagementController'
对于那些对我的控制器文件ManagementController.js感兴趣的人,看起来像这样;
formApp.controller('ManagementController', ['$scope', '$http', '$filter', '$state',function(scope, http, filter, state) { scope.testFunc = function() { scope.managementMsg = "Controller Works Fine."; }; }]);
对于那些想要一个快速启动angular骨架为例上面的例子检查这个链接https://github.com/zaferfatih/angular_skeleton
我知道这听起来很愚蠢,但在这里没有看到它:)。 我有忘记一个函数及其相关的分号,因为它被匿名分配到我的控制器的末尾的var引起这个错误。
看来,控制器的许多问题(无论是由注入错误,语法等引起的)都会导致出现此错误。
当您的控制器无法在应用程序中find时,将会看到该错误。 你需要确保你在ng-app
和ng-controller
指令中使用的值是正确的
这发生在我使用ng-include的时候,而且包含的页面已经定义了控制器。 显然这不被支持。
由ng-include加载的控制器不工作
我犯了一个愚蠢的错误,浪费了很多时间,所以在这里添加这个答案,以便帮助某人
我错误地添加$ scopevariables(依赖项)(添加它没有单引号)
比如我正在做的是这样的事情
angular.module("myApp",[]).controller('akshay',[$scope,
所需的语法是这样的
angular.module("myApp",[]).controller('akshay',['$scope',
//在第三种情况下包含控制器依赖项
var app = angular.module('app', ['controller']);
//第一个types声明控制器/ /这不工作
var FirstController = function($scope) { $scope.val = "First Value"; }
//第二种types的声明
app.controller('FirstController', function($scope) { $scope.val = "First Controller"; });
//第三和最好的types
angular.module('controller',[]).controller('FirstController', function($scope) { $scope.val = "Best Way of Controller"; });