angularjs — Как использовать данные по $ http.get с помощью простого PHP-API
Я пытаюсь подключить мое приложение angularjs к простому php-скрипту, который просто возвращает SQL-запрос из базы данных sqlite3.
Вот мой PHP-скрипт:
<?php
date_default_timezone_set('UTC');
try {
$objDb = new PDO('sqlite:../dbase/shopper');
$objDb -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT item.* ,
t.name AS type_name
FROM items item
INNER JOIN types t
ON t.id = item.type
ORDER BY item.date ASC";
$result = $objDb->query($sql);
if(!$result) {
throw new PDOException("The result returned no object");
}
$result->setFetchMode(PDO::FETCH_ASSOC);
$items = $result->fetchAll();
$sql = "SELECT *
FROM types
ORDER BY id";
$result = $objDb->query($sql);
echo var_dump($result);
if(!$result) {
throw new PDOException("The result returned no object");
}
$result->setFetchMode(PDO::FETCH_ASSOC);
$types = $result->fetchAll();
echo json_encode(array(
'error' => false,
'items' => $items,
'types' => $types
), JSON_HEX_TAG | JSON_HEX_APOS |JSON_HEX_QUOT |JSON_HEX_AMP );
} catch (PDOException $e) {
echo json_encode(array(
'error' => true,
'message' => $e->getMessage()
),JSON_HEX_TAG | JSON_HEX_APOS |JSON_HEX_QUOT |JSON_HEX_AMP );
}
Когда я проверяю адрес php файла, я могу получить результат:
object(PDOStatement)#3 (1) { ["queryString"]=> string(41) " SELECT * FROM types ORDER BY id " }
{"error":false,"items":[{"id":"1","item":"Butter","qty":"1","type":"1","done":"0","date":"2014-10-06 02:45:51","type_name":"Qty"}],"types":[{"id":"1","name":"Qty"},{"id":"2","name":"Kg"}]}
Если я использую angularjs, я получаю неопределенные результаты.
.controller('ShoppingListController', function($scope, $http, $log ){
$scope.types = [];
$scope.items = [];
$scope.item = '';
$scope.qty = '';
$scope.types = '';
$scope.select = function( ) {
$http({method: 'GET',url: 'mod/select.php'})
.success(function(data){
console.log(data)
$scope.items = data.items;if(data.types) {
$scope.types = data.types;
$scope.type = $scope.types[0].id;
}
})
.error(function(data,status,header){
throw new Error('Something went wrong with selecting record');
});
};
$scope.select();
});
console.log (data) показывает:
object(PDOStatement)#3 (1) {
["queryString"]=>
string(41) " SELECT *
FROM types
ORDER BY id "}
{"error":false,"items":[{"id":"1","item":"Butter","qty":"1","type":"1","done":"0","date":"2014-10-06 02:45:51","type_name":"Qty"}],"types":[{"id":"1","name":"Qty"},{"id":"2","name":"Kg"}]}
Как я могу это исправить ?
Решение
Вы должны вернуть JSON-ответ. Получите ассоциативный массив из вашей базы данных и верните это:
echo json_encode($db_query);
В Angular вы можете установить область, равную отклику, например:
$scope.items = data.items;
Вы можете получить доступ к этому на ваш взгляд (обязательно иметь ng-controller="ShoppingListController").
Чтобы перебрать данные:
ng-repeat="item in items"
Вы можете получить доступ к каждой части через item.id или каким бы ни был ваш ключ в массиве.
Кроме того, нет необходимости устанавливать $scope.items на вершине.
Редактировать:
.controller('ShoppingListController', function($scope, $http, $log) {
function select() {
$http.get('mod/select.php')
.success(function(data) {
$scope.items = data.items;
if(data.types) {
$scope.types = data.types;
$scope.type = $scope.types[0].id;
}
});
}
select();
});
Другие решения
Удалить var_dump(); И кстати, вам не нужно повторять с var_dump(), он уже добавляется в выходной буфер. var_dump() делает ваш ответ недействительным JSON.
detector