Угловой HTTP получить JSON не получает JSON

Question

У меня есть данные в формате JSON из базы данных:

{ "пользователь": "Роба" ,, { "пользователь": "Джон" ,, { "пользователь": "Крис" ,, etc etc

Я использую Angular для того чтобы получить JSON и поместить его в таблицу HTML.

<table> 
    <tr> 
    <th>Username:</th> 
    </tr> 
    <tr ng-repeat="x in names"> 
<td>{{ x.user}}</td> 

Используя следующий сценарий:

<script> 
    arudate.controller('customersCtrl', function($scope, $http) { 
    $http.get("sqlTest.php") 
    .success(function (response) {$scope.names = response.records;}); 
     }); 
</script> 

Но я ничего не получаю, как ни в JSON, даже если он показывает, как извлекается при sqlTest.php

Может кто-нибудь предлагать любую помощь или устранять неполадки, пожалуйста?

Answer 1

Убедитесь, что ваш скрипт sqlTest.php устанавливает правильный ответ Content-Type заголовок application/json. В противном случае угловой не знал бы, чтобы автоматически обрабатывать ответ. Если ваш скрипт сервер не возвращает правильные заголовки вам, возможно, потребуется вручную разобрать ответ на JavaScript Object:

$http.get('sqlTest.php').success(function (response) { 
    $scope.names = JSON.parse(response).records; 
}); 

Кроме того, убедитесь, что ваш JSON выглядит следующим образом:

{ 
    "records": [ 
     { "user": "Bob" }, 
     { "user": "John" }, 
     { "user": "Chris" }, 
     ... 
    ] 
} 

Другая вещь, которую вы должен смотреть на консоль панели инструментов разработчика вашего веб-браузера для любых потенциальных ошибок.

Answer 2

Вы только показываете верхнюю часть таблицы html - можем ли мы предположить, что у вас есть полная структура таблицы здесь?

<table> 
    <tr> 
     <th>Username:</th> 
    </tr> 
    <tr ng-repeat="x in names"> 
     <td>{{ x.user}}</td> 
    </tr> 
</table> 

Это также делает гораздо более четкий код, если вы используете особую форму ваших массивов для имени итератора, например «имя в именах» вместо «х в именах», и в этом случае вы получать множество людей или пользователей и отображения их имен, так что я хотел бы предложить следующее:

<table> 
    <tr> 
     <th>Username:</th> 
    </tr> 
    <tr ng-repeat="user in users"> 
     <td>{{user.name}}</td> 
    </tr> 
</table> 

Я не точно уверен, что выглядит ваши данные как, но если вы получаете список пользователей, это следует структурировать примерно так:

[ 
    { 
     "name": "Bob" 
    }, 
    { 
     "name": "John" 
    }, 
    { 
     "name": "Chris" 
    } 
] 

Попробуйте сохранить свой json-файл в виде текста и загрузить его из файловой системы сначала перед извлечением из источника данных/базы данных в реальном времени и сначала передать файл json через http://jsonlint.com, чтобы убедиться, что он действителен. Таким образом, вы устраняете неполадки только в своем коде, а также в случае неправильного формата данных и службы данных, которые могут или не всегда быть отзывчивыми.