首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >AngularJS工厂调用PHP然后返回到AngularJS

AngularJS工厂调用PHP然后返回到AngularJS
EN

Stack Overflow用户
提问于 2015-03-04 15:40:38
回答 2查看 819关注 0票数 0

在理解如何混合AngularJS和PHP时遇到了一些困难。我最初只是尝试让一个AngularJS工厂调用一个PHP (该文件获取一个查询),然后将它推回我的AngularJS工厂,在那里控制器可以使用数据。

以下是我到目前为止所得到的,当我尝试console.log结果时,这给了我“未定义的”。

工厂

代码语言:javascript
复制
app.factory("PlantServiceLIVE", function($http) {
  var mData = {};
  $http.get('pages/getplants.php').success(function(data) {
    mData.data = data;
  });
  return mData;
});

控制器

代码语言:javascript
复制
app.controller('TestController', function($scope, $http, PlantServiceLIVE) {
  $scope.Plants = PlantServiceLIVE.mData;
  console.log(JSON.parse($scope.Plants));
});

PHP (刚刚验证了以下内容是否适用于tooo)

代码语言:javascript
复制
$sql = "SELECT * FROM PlantTable";
$result = $conn->query($sql);
echo json_encode($result);

不知道我到底做错了什么,第一次这么做。

我得到的唯一开发人员控制台错误是SyntaxError: Unexpected token u,据我所读,这意味着数据是undefined

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-03-04 16:02:28

问题不在于角度,而在于Ajax请求是如何工作的。

AJAX请求异步工作,这意味着响应不能立即可用。您需要做的是准备好您的代码,以便在响应准备就绪时通知您。在vanilla中,您可以使用回调来获得通知,vanilla使用承诺

要使它正常工作,您需要稍微修改代码。工厂

代码语言:javascript
复制
app.factory("PlantServiceLIVE", function($http) {
  var mData = {
    gettingPlants: function(){
      return $http.get('pages/getplants.php')
    }
  };

  return mData;
});

控制器

代码语言:javascript
复制
app.controller('TestController', function($scope, $http, PlantServiceLIVE) {
  PlantServiceLIVE.gettingPlants.then(function(response){
    console.log(JSON.parse(response.data));
  });

});
票数 1
EN

Stack Overflow用户

发布于 2015-03-04 16:05:10

我认为主要的问题是,您实际上不是在调用$http.get(),而是定义它。另外,您应该阅读更多关于异步调用的角度(它们是真正的痛苦,但是在您掌握它们之后,它们会变得非常酷)。

这让我开始了:http://chariotsolutions.com/blog/post/angularjs-corner-using-promises-q-handle-asynchronous-calls/ (只需确保您远离他们的官方文档;这是一个非常混乱的问题,要么过于复杂,要么过于简化)。

不管怎样,为了你的问题:

在你的工厂里试试这个:

代码语言:javascript
复制
app.factory("PlantServiceLIVE", function($http) {
  var mData = {
        get_data : function(){
            return $http.get('pages/getplants.php').success(function(data) {
                     return mData.data = data;
                   });
        }
      };

  return mData;
});

然后在控制器中获取数据(在收到数据后),如下所示:

代码语言:javascript
复制
app.controller('TestController', function($scope, $http, PlantServiceLIVE) {
  $scope.click_me = function(){
    var wait = PlantServiceLIVE.mData();
    wait.then(function(data){
      console.log(data); //you should have your data here.
      $scope.Plants = data;
    });
  }
});

然后让它触碰

代码语言:javascript
复制
<button ng-click="click_me()">Gimme plants</button>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/28858566

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档