Я разрабатываю простое гибридное мобильное приложение, использующее Ionic framework. Когда вы ищете фамилию, запрос GET отправляется для получения всех совпадающих имен, а затем отображает их соответствующие идентификаторы. У меня возникла проблема с отображением возвращаемых данных из объекта JSON.
Ниже приведена страница html:
<ion-view view-title="Account" ng-controller="AccountCtrl">
<ion-content>
<div class="list">
<div class="item item-input-inset">
<label class="item-input-wrapper">
<input type="text" placeholder="Search" ng-model="name">
</label>
<button class="button button-small" ng-click="searchUser(name)">
Go
</button>
</div>
</div>
<div>
<ul ng-repeat="user in $results">
<li>{{user.id}}</li>
</ul>
</div>
</ion-content>
Далее находится файл js, который успешно возвращает заполненный объект JSON со всем, что мне нужно.
angular.module('starter.controllers', [])
.controller('AccountCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.searchUser = function (name) {
$http.get('https://notrelevantforthis/searchLastName?=' + name).then(function (response) {
console.log(response.data)
//Assign JSON obj to results to repeat through and display data
$scope.results = response.data;
//To show the actual JSON object is returned
//var jsonStr = JSON.stringify($scope.results);
//document.body.innerHTML = jsonStr;
}, function (error) {
console.log(error)
});
};
}]);
Теперь важной частью является структура самого объекта JSON. Я думаю, что здесь я смущаюсь. Структура выглядит следующим образом:
{
"response": {
"totalFound": 275,
"start": 0,
"acc": [
{
"id": [
"1"
],
"first_name": [
"Joe"
],
"last_name": [
"Smith"
]
},
{
"id": [
"2"
],
"first_name": [
"John"
],
"last_name": [
"Doe"
]
}]}
}
Моя проблема заключается в повторении объекта JSON с использованием ng-repeat, я думаю. По какой-то причине ни одна из данных не отображается, но объект определенно присутствует при просмотре консоли. Любая помощь или направление в том, что я делаю неправильно, было бы очень оценено, поскольку я новичок в этом и пытаюсь найти правильный способ сделать это.
EDIT: Пробовал использовать повтор коллекции, также предлагаемый ионной структурой, но получал ошибки ограничения стека.
Когда вы назначаете response.data
для $scope.results
, вы буквально назначаете ему тело ответа HTTP, которое является целым объектом JSON, который у вас есть в вашем вопросе. Вам нужно будет указать на response.data.response.acc
если вы хотите ng-repeat
через эти учетные записи.
В вашем шаблоне он должен просто быть ng-repeat="user in results"
, без $
перед results
.
Ваш объект JSON перечисляет id
для каждой учетной записи в виде массива, я бы рекомендовал просто указывать буквальное значение без массива, иначе в вашем ng-repeat вам придется использовать {{user.id[0]}}
для фактического напечатайте значение без печати самого массива.
Я привел пример для вас здесь: http://plnkr.co/edit/GYeF4FzVHl8Og5QTFcDx?p=preview