php - 如何使用 angularjs $http 从 phpmyadmin 表中检索数据？

Question

我可以向表发送数据，但无法检索数据。这是 我试过的代码。我想在 html 页面中显示表格的详细信息。我不明白为什么这段代码不起作用。谁能帮忙？

php代码:

<?php
    $con = mysqli_connect('localhost','root','','hamatkin');
    if(!$con){
        die("couldnt connect".mysqli_error);
    }
    $query = "SELECT * FROM customers";
    $result = $con->query($query);
    $r = array();
    if( $result->num_rows>0){
        while($row = $result->fetch_assoc()){
            $r[] = $row;
        }
    }
    $res = json_encode($r);
    echo $res;
?>

Controller :

"use strict";
var app = angular.module('dataSystem',[]);
app.controller('customerListCtrl',function($scope,$http){
    $http({method:'GET', url:'get-allCustomers.php'}).success(function(response){
        $scope.customers = response;});
    });
});

HTML:

<div>
    <table ng-controller="customerListCtrl" >
        <tr ng-repeat="x in customers">
            <td> {{ x.customer_id}} </td>
            <td> {{ x.first_name }} </td>
            <td> {{ x.last_name }} </td>
            <td> {{ x.id}} </td>
            <td> {{ x.city}} </td>
            <td> {{ x.adress}} </td>
            <td> {{ x.phone}} </td>
            <td> {{ x.email}} </td>
            <td> {{ x.fax}} </td>
            <td> {{ x.referrer}} </td>
            <td> {{ x.comments}} </td>
        </tr>
    </table>
</div>

Answer 1

您必须使用 response.data 而不是仅使用 response

重要提示:

The $http legacy promise methods success and error have been deprecated. Use the standard then method instead. If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.

"use strict";
var app = angular.module('dataSystem',[]);
app.controller('customerListCtrl',function($scope,$http){
    $http({method:'GET', url:'get-allCustomers.php'}).then(function(response){
        $scope.customers = response.data;
    }, function(response){
       //Your errorhandler
    });
});

为了提高可读性，您还可以为 get 请求使用较短的版本:

$http.get('get-allCustomers.php').then(function(response){
    $scope.customers = response.data;
}, function(response){
   //Your errorhandler
});