javascript - AngularJS 不显示 MySQL 结果 *已编辑

Question

MySQL 数据概览 View (root.html) 不显示数据。但是，打开/php/overview.php 表明可以正确获取数据:

Connection to MySQL server successful. [{"Job_title":"flash","Job_id":"doggg"},{"Job_title":"ad34","Job_id":"teeee"}]

root.html

<table class="setup-table">
    <tr>
        <td>Job title</td>
        <td>Job ID</td>
    </tr>
    <tr data-ng-repeat="campaign in campaigns">
        <td>A {{campaign.Job_title}}</td>
        <td>B {{campaign.Job_id}}</td>

    </tr>
</table>

controller.js(请注意，出现“It WORKED(DELETE Later)”警告，但 View 中的表为空:

ctr.controller
('RootCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http)

                {

                    $http.get("php/overview.php")
                        .then(function successCallback(response){
                            console.log(response);
                            $scope.campaigns = response.data;
                            alert("It WORKED (DELETE ME)");

                        }
                        , function errorCallback(response) {
                            $scope.campaigns = "error in fetching data";
                            alert("DID NOT WORK ");}
                            )
                        ;}

                ]);

概览.php

<?php
include_once('db.php');

$query = "SELECT Job_title, Job_id FROM campaign";
$result = $connect->query($query);
$data = array();

while ($row = mysqli_fetch_array($result,MYSQL_ASSOC)) {
    $data[] = $row;
}
print json_encode($data);
mysql_close($connect);

?>

Answer 1

大多数情况下，当您获得服务器路由时，您会收到一个完整的响应对象作为回复，而不仅仅是请求的数据，因此将进行此调用的代码部分更改为如下所示:

{
    $http.get("php/overview.php")
     .success(function(response){
         console.log(response);
         $scope.campaigns = response.data;
         alert("It WORKED (DELETE Later)");
      })
      .error(function() {
          $scope.campaigns = "Could not fetch data";
          alert("DID NOT WORK (DELETE Later");
      });
}

应该可以解决问题。我还添加了一个 console.log 调用，以便您可以检查响应。

注意:success 和 error 已弃用。建议您使用 .then() 来响应 $http 调用。重构非常小。