[英]Argument 'fn' is not a function got string
I have a part in my angular application on which I've binded a controller, 我在我的角度应用程序中有一部分,我已经绑定了一个控制器,
since then I got the Argument 'fn' is not a function Error, can anyone look at my code and explain why I got that Error? 从那以后我得到了参数'fn'不是函数错误,任何人都可以查看我的代码并解释为什么我得到了这个错误?
I would be very gratefull :) 我会非常感激:)
html-markup: HTML的标记:
<section class="col-lg-12" data-ng-controller="MessageController">
<fieldset>
<legend>{{ 'MESSAGES' | translate }}</legend>
</fieldset>
<div class="margin-left-15">
<ul class="list-style-button">
<li data-ng-repeat="message in MSG">{{ message }}</li>
</ul>
</div>
</section>
controller: 控制器:
(function() {
'use strict';
var controllers = angular.module('portal.controllers');
controllers.controller('MessageController', ['$scope', 'MessageService', '$rootScope', function MessageController($scope, MessageService, $rootScope) {
$rootScope.MSG = MessageService.getMessages();
$rootScope.$watch('MSG', function(newValue) {
$scope.MSG = newValue;
});
}]);
}());
Service: 服务:
(function() {
'use strict';
var messageServices = angular.module('portal.services');
messageServices.factory('MessageService', ['MessageData', 'localStorageService', 'UserService'], function(MessageData, localStorageService, UserService) {
return new MessageService(MessageData, localStorageService, UserService);
});
function MessageService(MessageData, localStorageService, UserService) {
this.messageData = MessageData;
this.localStorageService = localStorageService;
this.userService = UserService;
}
MessageService.prototype.getMessages = function() {
var locale = this.userService.getUserinfoLocale();
var messages = this.localStorageService.get(Constants.key_messages + locale);
if (messages !== null && messages !== undefined) {
return JSON.parse(messages);
} else {
return this.messageData.query({
locale: locale
}, $.proxy(function(data, locale) {
this.save(Constants.key_messages + locale, JSON.stringify(data));
}, this));
}
};
MessageService.prototype.save = function(key, value) {
this.localStorageService.add(key, value);
};
}());
data: 数据:
(function() {
'use strict';
var data = angular.module('portal.data');
data.factory('MessageData', function($resource) {
return $resource(Constants.url_messages, {}, {
query: {
method: 'GET',
params: {
locale: 'locale'
},
isArray: true
}
});
});
}());
order of js files in html head: html头中js文件的顺序:
<script src="js/lib/jquery-1.10.js"></script>
<script src="js/lib/angular.js"></script>
<script src="js/lib/angular-resource.js"></script>
<script src="js/lib/angular-translate.js"></script>
<script src="js/lib/angular-localstorage.js"></script>
<script src="js/lib/jquery-cookies.js"></script>
<script src="js/lib/bootstrap.js"></script>
<script src="js/portal.js"></script>
The problem was in using the 'wrong' syntax to create the service 问题在于使用“错误”语法来创建服务
instead of using: 而不是使用:
messageServices.factory('MessageService',
['MessageData','localStorageService', 'UserService'],
function(MessageData, localStorageService, UserService){
return new MessageService(MessageData, localStorageService, UserService);
}
);
I had to use: 我不得不使用:
messageServices.factory('MessageService',
['MessageData','localStorageService', 'UserService',
function(MessageData, localStorageService, UserService){
return new MessageService(MessageData, localStorageService, UserService);
}
]);
I closed the array with parameters to soon, and since I'm still learning I didn't see it directly, anyhow I hope I can help others who stumble upon this. 我很快就用参数关闭了数组,因为我还在学习,我没有直接看到它,无论如何我希望我可以帮助那些偶然发现它的人。
Today I got the same kind of error doing that silly mistake: 今天我犯了同样的错误,做了那个愚蠢的错误:
(function(){
angular
.module('mymodule')
.factory('myFactory', 'myFactory'); // <-- silly mistake
myFactory.$inject = ['myDeps'];
function myFactory(myDeps){
...
}
}());
instead of that: 而不是:
(function(){
angular
.module('mymodule')
.factory('myFactory', myFactory); // <-- right way to write it
myFactory.$inject = ['myDeps'];
function myFactory(myDeps){
...
}
}());
In fact the string "myFactory" was brought into the injector who was waiting for a function and not a string. 事实上,字符串“myFactory”被带入正在等待函数而不是字符串的注入器中。 That explained the [ng:areq] error. 这解释了[ng:areq]错误。
The above answers helped me considerably in correcting the same issue I had in my application that arose from a different cause. 以上答案帮助我大大纠正了我在应用程序中出现的同一问题,该问题源于不同的原因。
At built time, my client app is being concatenated and minified, so I'm writing my Angular specifically to avoid related issues. 在构建时,我的客户端应用程序正在连接和缩小,所以我正在编写我的Angular专门用于避免相关问题。 I define my config
as follows 我定义我的config
如下
config.$inject = [];
function config() {
// config stuff
}
(I define a function, $inject
it as a module and declare what it is). (我定义了一个函数, $inject
它作为模块$inject
并声明它是什么)。
And then I tried to register the config
just as I registered other modules in my app (controllers, directives, etc..). 然后我尝试注册config
就像我在我的应用程序中注册其他模块(控制器,指令等...)。
angular.module("app").config('config', config); // this is bad!
// for example, this is right
angular.module("app").factory('mainService', mainService);
This is wrong, and gave me the aforementioned error. 这是错的,并且给了我上面提到的错误。 So I changed to 所以我改为
angular.module("app").config(config);
And it worked. 它奏效了。 I guess the angular devs intended config
to have a singular instance and by so having Angular not accept a name when config
is registered. 我想角度开发者打算config
一个单一的实例,因此让Angular在注册config
时不接受名称。
I had the same issue and In my case the problem was with angular-cookies.js file. 我有同样的问题,在我的情况下问题是angular-cookies.js文件。 It was in folder with other angularjs scripts and when I have used gulp to minify my js files the error occured. 它与其他angularjs脚本在文件夹中,当我使用gulp缩小我的js文件时发生错误。
Simple solution was just to place the angular-cookies.js file to another folder, outside the selected folder to minify js files. 简单的解决方案是将angular-cookies.js文件放在所选文件夹之外的另一个文件夹中以缩小js文件。
My case 我的情况
let app: any = angular.module("ngCartosServiceWorker"),
requires: any[] = [
"$log",
"$q",
"$rootScope",
"$window",
"ngCartosServiceWorker.registration",
PushNotification
];
app.service("ngCartosServiceWorker.PushNotification");
I forgot to add requires Array as parameters to service like this 我忘了添加Require Array作为服务的参数,就像这样
app.service("ngCartosServiceWorker.PushNotification", requires);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.