使用angularjs将数据发布到PHP

时间:2015-07-13 13:39:29

标签: php angularjs ionic

如何提交表单并将帖子数据传递给angularjs?我知道这一定是微不足道的任务,但看不出我的错误。

该数据会在PHP API中提供消费webservice并返回JSON的帖子变量,并且在我不使用搜索功能时它会正常工作。

我有monthorigin传递给控制器​​中的搜索功能,而在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    
  };
})

1 个答案:

答案 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);
    })
  }
}