我正在尝试编写示例AngularJS和SpringMVC项目。spring方法可以正常工作,但是我的站点控制器中的函数声明存在问题。我的应用应该从文本输入中返回一个单词,但是当我单击按钮时,出现了以下错误:
[13:23:58.900] "Error: fnPtr is not a function parser/_functionCall/<@http://localhost:8080/example/resources/js/Angular/angular.js:6542 ngEventDirectives[directiveName]</</</<@http://localhost:8080/example/resources/js/Angular/angular.js:13256 Scope.prototype.$eval@http://localhost:8080/example/resources/js/Angular/angular.js:8218 Scope.prototype.$apply@http://localhost:8080/example/resources/js/Angular/angular.js:8298 ngEventDirectives[directiveName]</</<@http://localhost:8080/example/resources/js/Angular/angular.js:13255 createEventHandler/eventHandler/<@http://localhost:8080/example/resources/js/Angular/angular.js:2095 forEach@http://localhost:8080/example/resources/js/Angular/angular.js:130 createEventHandler/eventHandler@http://localhost:8080/example/resources/js/Angular/angular.js:2094 "
这是我的index.html:
<!DOCTYPE html> <html lang="en" ng-app="Apken"> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script src="resources/js/Angular/angular.js"></script> <script src="resources/js/controler.js"></script> </head> <body ng-controller="theNamer"> <div class="input-append"> <input style="width:358px;" class="span2" type="text" ng-model="myName" required min="1" /> <button class="btn btn-primary" ng-disabled="!myName" ng-click="send()">Click!</button> </div> <ul> <li ng-repeat="name in names">{{name}}</li> </ul> </body> </html>
和controller.js:
function theNamer ($scope,$http){ $scope.myName='aa'; $scope.fetchList=new function() { $http.get('ca/list.json').success(function(thList){ $scope.names = thList; }); } $scope.send=new function() { $http.post('ca/set/3').success(function(){ $scope.fetchList; }); } $scope.fetchList; } var Apken = angular.module('Apken',[]); Apken.controller('theNamer', theNamer);
我注意到,这一定是ng-click值中的函数声明存在某种问题。在现场启动时,controler.js可以正常运行,但是当我单击该按钮时它会崩溃。
我已经测试过您的代码。使用AngularJS 1.0.7,替换后错误消失
$scope.send = new function() {
与
$scope.send = function () {
同样适用于fetchList。
fetchList
我猜您混合了两种语法function(*args*) { *body* }和new Function(*args*, *body*)。检查MDN:功能。
function(*args*) { *body* }
new Function(*args*, *body*)
您还必须更改代码才能fetchList正确调用您的代码:
function theNamer($scope, $http) { $scope.myName = 'aa'; $scope.fetchList = function() { $http.get('ca/list.json').success(function(thList) { $scope.names = thList; }); }; $scope.send = function() { $http.post('ca/set/3').success(function() { $scope.fetchList(); }); }; $scope.fetchList(); }