我的 M*EAN 应用程序应该使用 php 将数据从数据库返回到 Angular 端，但是当 Controller 运行并且 $http.get 执行时，response.data 返回 index.html 的源代码。
我认为帮助我们找到错误所需的所有代码都在下面。还有一些屏幕截图显示了使用开发人员工具在 Chrome 中运行该应用程序时发生的情况，以便您确切了解我在说什么。
我们在 MAMP 服务器上运行，我知道我们的应用程序在 Apache 服务器上运行，但我们不知道为什么我们仍然没有获取 JSON 数据，而是将 HTML 作为 JSON 响应发送.
这是附带的代码:
市场.php
<?php
header("Access-Control-Allow-Origin: *");
include 'dbConfig.php';
$sel = mysqli_query($con,"select * from Chef");
if (!$sel) {
printf("Error: %s\n", mysqli_error($con));
exit();
}
$data = array();
while ($row = mysqli_fetch_array($sel)) {
$point = array("fullname"=>$row["fullname"],"city"=>$row["city"],"state"=>$row["state"],"zip_code"=>$row["zip_code"],"rating"=>$row["rating"]);
array_push($data, $point);
}
header('Content-type: application/json; charset=utf-8');
echo json_encode($data);
市场 Controller .js
angular.module('OrchidApp')
.controller('marketController', function ($scope, $http) {
console.log('ANYTHING');
$scope.users=[];
$http({method: 'GET', url:'market.php', headers:{ 'X-Force-Content-Type': 'application/json' }})
.then(function successCallback(response) {
$scope.users = response.data;
console.log($scope.users);
console.log("There is data here.");
return $scope.users;
}, function errorCallback(response) {
console.log(response.data);
console.log("Error.");
});
});
index.html
<!doctype html>
<html lang="en" ng-app="OrchidApp" >
<head>
<title>Orchid</title>
<meta charset="utf-8">
<base href="/">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.3/angular-cookies.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.min.js"></script>
<script src="/js/app.js"></script>
<script src="/js/authService.js"></script>
<script src="/js/profileController.js"></script>
<script src="/js/marketControllers.js"></script>
<script src="/js/navController.js"></script>
<script src="/js/loginController.js"></script>
<script src="/js/signupController.js"></script>
</head>
<body class="container">
<div ng-controller="marketController">
<p>Above the table.</p>
<table>
<tr ng-repeat="user in users track by $index">
<td>{{user.fullname}}</td>
<td>{{user.city}}</td>
<td>{{user.state}}</td>
<td>{{user.zip_code}}</td>
<td>{{user.rating}}</td>
</tr>
</table>
<p>Below the table.</p>
</div>
</body>
</html>
截图:
最佳答案
启动并运行后端/api 后，您可能还想将 API 的 url 添加到 $http.get，当前调用是相对的，因此它将尝试 http://localhost:3000/market.php
你可以这样做:
app.js 之前的 index.html
<script>
window.api = "http://localhost:3001"
</script>
Controller ...
$http({method: 'GET', url: window.api + '/market.php'})...
关于javascript - $http.get 返回 index.html 代码，而不是来自 php 数据库调用的数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47022677/