如何提交表单并将帖子数据传递给angularjs
?我知道这一定是微不足道的任务,但看不出我的错误。
该数据会在PHP
API
中提供消费webservice
并返回JSON
的帖子变量,并且在我不使用搜索功能时它会正常工作。
我有month
和origin
传递给控制器中的搜索功能,而在ApiAcp工厂,我得到了url: q.resolve(data);
当我提交时,控制台日志说:“无法读取未定义的url
属性”,我无法看到如何正确地将端点url
注入搜索功能,因为搜索没有参数工作正常。
以下是模板和搜索按钮:
<form method="post" ng-controller="AcpSearchCtrl" ng-submit="searchAcp(data)">
<select name="month" ng-model="data.month">
<option value="01">January</option>
<option value="02">February</option>
...
</select>
<select name="origin" ng-model="data.origin">
<option value="99">OneState</option>
...
...
</select>
<input type="button" ng-click="search(data)" value="Search"/>
在Controller中我尝试创建一个不起作用的搜索功能,说无法读取未定义的属性URL:
.controller('AcpSearchCtrl', function($scope, ApiAcp, $timeout, $http, ApiAcpEndpoint, $q) {
$scope.searchAcp = function(data ) {
$scope.month = data.month;
$scope.origin = data.origin;
var q = $q.defer();
$http.post(ApiAcpEndpoint.url, data)
.then(function(data) {
console.log(data);
console.log(' - data.month '+data.month);
console.log(' - data.origin '+data.origin);
q.resolve(data);
console.log(' q.promise '+q.promise);
var acp = {};
acp.dados = [ data ];
$scope.data = acp.dados;
console.log('data :'+$scope.data);
return q.promise;
});
}
})
在Services.js中,我发布数据,如果我不按月或原点搜索,它就可以工作:
.factory('ApiAcp', function($http, $q, ApiAcpEndpoint) {
console.log('1. ApiAcpEndpoint url ', ApiAcpEndpoint.url)
var getApiData = function() {
var q = $q.defer();
$http.post(ApiAcpEndpoint.url)
.success(function(data) {
q.resolve(data);
})
.error(function(error){
console.log('Had an error'+error)
q.reject(error);
})
return q.promise;
}
return {
getApiData: getApiData
};
})
答案 0 :(得分:1)
应该在控制器定义/初始化中注入ApiAcpEndpoint,而不是在$ scope.search中注入(同样适用于$ http)
.controller('AcpCtrl', function($scope, ApiAcp, $ionicLoading, $timeout, $http, ApiAcpEndpoint) {
$scope.data = null;
ApiAcp.getApiData()
.then(function(result) {
console.log(result);
$scope.headers = ['Desc','Real. month', 'Real. year/month', 'Plan. year/month', 'Real. year'];
var acp = {};
$scope.data = acp.dados;
console.log(' scope.data '+$scope.data);
})
$scope.search = function(data) {
$http.post(ApiAcpEndpoint.url,data)
.success(function(data){
console.log(' data from : '+data);
})
}
}