用PHP和AngularJS显示JSON文件

我一直试图在Phpmyadmin上显示数据库中的json文件，但都没有成功。有人能告诉我我做错了什么吗

这是我的密码：

json.php

    <?php
    header("Access-Control-Allow-Origin: *");
    $con = mysqli_connect("localhost","root","","test");
    // Check connection
    if (mysqli_connect_errno())
    {
        echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }

    $data=array();
    $q=mysqli_query($con, "select * from mesures");
    while ($row=mysqli_fetch_object($q)){
     $data[]=$row;
    }
    echo json_encode($data);
    mysqli_close($con);
?>

recordService.js

angular.module('recordService', []).factory('recordService', ["$timeout", function ($timeout) {

    var RecordService = {};

    var recordList = new Array();

    return {
        getAll : function (callback) {
            $(document).ready(function()
             {
                 var url="http://localhost/Effienergy/Effi-Prove/www/database/json.php";
                 $.getJSON(url,function(result){
                     //console.log(result);
                     $.each(result, function(i, field){
                         var record =
                         {
                            "test" : field.test,
                            "test2" : field.test2,
                         };
                         recordList.push(record);
                         //console.log(record)
                     });
                 }).done(function(){callback(recordList)});
             });
        },

        get : function (id) {
            for (record in this.recordList) {
                if ((this.recordList[record]).id == id) {
                    return (this.recordList[record]);
                }
            }
            return null;
        },

        add : function (record) {
            this.recordList.push(record);
        }



//        //5 secondes après le chargement de la page, la valeur d'une propriété change dans le service.
//        //La view est mise à jour automatiquement
//        $timeout(function() {
//            userData.userName = "NATNAT";
//        }, 5000);


    };

}]);

当我在开发人员控制台中检查Json时，它似乎是有效的，所以我假设它与我尝试执行的范围有关

以下是我的json：

---

提前感谢

请尝试更改此行

$data [] = $row;

到

---

请试着换一行

$data [] = $row;

到

---

我看到我的评论没有再发了。让我第三次试试。$。getJson不是Angular，更改对Angular不可见。请替换为$http（{url:url}）。然后（functiom（rs）{console.log（rs）}，functiom（err）{console.log（err）}） 正在消失的阵列可能正在缓存。在chrome开发工具中，请在网络选项卡下禁用缓存

编辑：确定查看您的粘贴箱，$http不会返回结果：

您的服务应如下所示：

angular.module('recordService', []).factory('recordService', ['$http', function($http) {
    var recordService = [];
    recordService.getAll = function (callback) {
        var url = "http://localhost/Effienergy/Effi-Prove/www/database/json.php";
        $http({url: url}).then(function (rs) {
            callback(rs.data);
            console.log(rs)

        }, function (err) {

            console.log(err)
        })

    }
    return recordService;
}]);

然后在控制器中保持简单：

angular.module('mesure', [])

.controller('measureController', function($scope, recordService) {

        $scope.records = [];       
        recordService.getAll(function(rs) {
            $scope.records = rs;
            console.log(rs);
        });
}]);

你的索引看起来不错

<div ng-controller="measureController as measureCtrl" style="margin-top:170px; border:0">
    <h1>ok</h1>
    <div ng-repeat="record in measureCtrl.records" class="row">
        {{record.test}} - {{record.test2}}
    </div>
</div>

好啊
{{record.test}-{{record.test2}

我看到我的评论没有再次发布。让我第三次试试。$。getJson不是Angular，更改对Angular不可见。请替换为$http（{url:url}）。然后（functiom（rs）{console.log（rs）}，functiom（err）{console.log（err）}） 正在消失的阵列可能正在缓存。在chrome开发工具中，请在网络选项卡下禁用缓存

编辑：确定查看您的粘贴箱，$http不会返回结果：

您的服务应如下所示：

angular.module('recordService', []).factory('recordService', ['$http', function($http) {
    var recordService = [];
    recordService.getAll = function (callback) {
        var url = "http://localhost/Effienergy/Effi-Prove/www/database/json.php";
        $http({url: url}).then(function (rs) {
            callback(rs.data);
            console.log(rs)

        }, function (err) {

            console.log(err)
        })

    }
    return recordService;
}]);

然后在控制器中保持简单：

angular.module('mesure', [])

.controller('measureController', function($scope, recordService) {

        $scope.records = [];       
        recordService.getAll(function(rs) {
            $scope.records = rs;
            console.log(rs);
        });
}]);

你的索引看起来不错

<div ng-controller="measureController as measureCtrl" style="margin-top:170px; border:0">
    <h1>ok</h1>
    <div ng-repeat="record in measureCtrl.records" class="row">
        {{record.test}} - {{record.test2}}
    </div>
</div>

好啊
{{record.test}-{{record.test2}

您遇到了什么错误？请尝试添加以下行：header（'Content-type:text/json'）；标题（'Content-type:application/json'）@Ramkee的问题是，我在控制台中没有得到任何特定的错误。我的房间空着。我尝试了标题，但不幸的是没有修复您得到的错误是什么？尝试添加以下行：header（'Content-type:text/json'）；标题（'Content-type:application/json'）@Ramkee的问题是，我在控制台中没有得到任何特定的错误。我的房间空着。我尝试了头球，不幸的是没有修正，不幸的是没有修正。谢谢你的帮助。另一件奇怪的事情是，当我检查元素时，看起来我没有访问ng-repeat的权限。我明白了" . 我不知道这是否正常，请我忘了提一下。document.ready块不属于Amgular。请把它们全部拿走。此外，这个.records需要是控制器中的$scope.records，谢谢您的回答。我照你说的做了，但也没有解决问题。难以置信，我通过垃圾邮件刷新看到了我的阵列。然后我再次刷新，它消失了。。。我不明白如果你有机会请使用$http并让我们知道结果，你还需要将其注入recordServiceHello，不幸的是没有修复。谢谢你的帮助。另一件奇怪的事情是，当我检查元素时，看起来我没有访问ng-repeat的权限。我明白了" . 我不知道这是否正常，请我忘了提一下。document.ready块不属于Amgular。请把它们全部拿走。此外，这个.records需要是控制器中的$scope.records，谢谢您的回答。我照你说的做了，但也没有解决问题。难以置信，我通过垃圾邮件刷新看到了我的阵列。然后我再次刷新，它消失了。。。我不明白如果您有机会请使用$http并让我们知道结果，您还需要将其注入recordServiceNo problem，谢谢您的回答。我感觉我离目标很近了，多亏了console.log（rs），我才能看到这个对象。但我现在不太确定如何将它推入我的数组：/这是我目前的代码：它取决于JSON的格式。你能在网络选项卡中发布我的JSON的显示方式吗：。不确定这是否是你想要看到的，你也可以在我的原始帖子中查看我的json.php文件哦，好的，我看到了，但那是测试数据。在我们进一步讨论之前，您想对数据做什么？我想通过作用域（{record.test}}）在我的索引页上显示我的数据的值，也许以后可以在表中对它们进行排序，但首先如果我真的能看到它们，我会很高兴。没问题，谢谢您的回答。我感觉我离目标很近了，多亏了console.log（rs），我才能看到这个对象。但我现在不太确定如何将它推入我的数组：/这是我目前的代码：它取决于JSON的格式。你能在网络选项卡中发布我的JSON的显示方式吗：。不确定这是否是你想要看到的，你也可以在我的原始帖子中查看我的json.php文件哦，好的，我看到了，但那是测试数据。在我们进一步讨论之前，您想对数据做什么？我想通过作用域（{record.test}}）在索引页上显示我的数据的值，可能以后在表中对它们进行排序，但首先如果我能真正看到它们，我会很高兴。