AngularJS - 从未使用 ng-submit 调用过的函数
AngularJS - function never called with ng-submit
我创建了一个 angular-promise,它调用一个 http 方法(对应于一个 rest 服务),应该在提交表单时调用,使用 ng-submit。
它从未发生过,也没有错误,似乎从未调用过该函数。
所以这是 javascript 代码:
myapp.factory('CardFactory', ['$http', function($http){
return{
cardService: function(hclass) {
return $http({
method: 'get',
url: UrlServices.baseUrl + 'http://localhost:8080//HSRestServices/hsrest/decks/getCards/' + hclass,
})
}
}
}])
myapp.controller('CardCtrl', ['$scope', 'CardFactory', function($scope, CardFactory ){
$scope.card = "Druid";
$scope.cardService = function() {
CardFactory.cardService($scope.card)
.then(function (response) {
$scope.status = response.status;
$scope.card = response.data;
console.log("Response: " + JSON.stringify({data: response.data}));
if (response.status == 200){
$scope.card = response.data;
} else {
console.log("Response: Something went wrong.");
}
}, function (response) {
console.log("Response: Something went wrong.");
})
};
}]);
和html代码:
<body ng-app="mainApp">
<div ng-controller="CardCtrl">
<form ng-submit="cardService()">
<input type="submit" value="Submit">
</form>
<p ng-model="card">{{card}}</p>
</div>
</body>
有什么想法吗?先谢谢了。
如果您在应用程序中没有看到 "Druid" 一词,很可能您没有在应用程序中包含 angular.js 和 app.js。
如果这样做,它可能正在工作,并且您没有正确定义 UrlServices,它找不到它。您可以查看浏览器控制台了解更多详情。
否则对我有用。看看这个 jsfiddle:https://jsfiddle.net/j8o0ag4t/
在控制台中我看到:
Error: Can't find variable: UrlServices
cardService@http://fiddle.jshell.net/j8o0ag4t/show/:50:29
cardService@http://fiddle.jshell.net/j8o0ag4t/show/:62:28
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:160:97
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:177:84
$评估@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:100:328
$申请@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:101:110
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:177:71
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:27:19
forEach@[本机代码]
p@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:7:262
c@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:26:493
您必须为您的表单提供 name
属性,并且其所有后续表单元素本身也应具有 name
。
此外,您不能在 p
标签上使用 ng-model
。使用输入类型文本如下:
HTML:
<form name="cardForm" ng-submit="cardService()" novalidate>
<input type="text" name="card" />
<input ng-model="card" type="submit" value="Submit">
</form>
我创建了一个 angular-promise,它调用一个 http 方法(对应于一个 rest 服务),应该在提交表单时调用,使用 ng-submit。 它从未发生过,也没有错误,似乎从未调用过该函数。 所以这是 javascript 代码:
myapp.factory('CardFactory', ['$http', function($http){
return{
cardService: function(hclass) {
return $http({
method: 'get',
url: UrlServices.baseUrl + 'http://localhost:8080//HSRestServices/hsrest/decks/getCards/' + hclass,
})
}
}
}])
myapp.controller('CardCtrl', ['$scope', 'CardFactory', function($scope, CardFactory ){
$scope.card = "Druid";
$scope.cardService = function() {
CardFactory.cardService($scope.card)
.then(function (response) {
$scope.status = response.status;
$scope.card = response.data;
console.log("Response: " + JSON.stringify({data: response.data}));
if (response.status == 200){
$scope.card = response.data;
} else {
console.log("Response: Something went wrong.");
}
}, function (response) {
console.log("Response: Something went wrong.");
})
};
}]);
和html代码:
<body ng-app="mainApp">
<div ng-controller="CardCtrl">
<form ng-submit="cardService()">
<input type="submit" value="Submit">
</form>
<p ng-model="card">{{card}}</p>
</div>
</body>
有什么想法吗?先谢谢了。
如果您在应用程序中没有看到 "Druid" 一词,很可能您没有在应用程序中包含 angular.js 和 app.js。
如果这样做,它可能正在工作,并且您没有正确定义 UrlServices,它找不到它。您可以查看浏览器控制台了解更多详情。
否则对我有用。看看这个 jsfiddle:https://jsfiddle.net/j8o0ag4t/
在控制台中我看到:
Error: Can't find variable: UrlServices
cardService@http://fiddle.jshell.net/j8o0ag4t/show/:50:29 cardService@http://fiddle.jshell.net/j8o0ag4t/show/:62:28 http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:160:97 http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:177:84 $评估@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:100:328 $申请@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:101:110 http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:177:71 http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:27:19 forEach@[本机代码] p@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:7:262 c@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js:26:493
您必须为您的表单提供 name
属性,并且其所有后续表单元素本身也应具有 name
。
此外,您不能在 p
标签上使用 ng-model
。使用输入类型文本如下:
HTML:
<form name="cardForm" ng-submit="cardService()" novalidate>
<input type="text" name="card" />
<input ng-model="card" type="submit" value="Submit">
</form>