Я создаю приложение с помощью ионного /AngularJS. Чтобы протестировать вызовы веб-службы, я использую лучший сервис для покупок. Ответ следующий:
{
"from": 1,
"to": 10,
"total": 4665,
"currentPage": 1,
"totalPages": 467,
"queryTime": "0.009",
"totalTime": "0.045",
"partial": false,
"canonicalUrl": "/v1/categories?format=json&apiKey=****",
"categories": [
{
"id": "abcat0010000",
"name": "Gift Ideas",
"active": true,
"path": [
{
"id": "cat00000",
"name": "Best Buy"
},
{
"id": "abcat0010000",
"name": "Gift Ideas"
}
],
"subCategories": [
{
"id": "pcmcat140000050035",
"name": "Capturing Photos & Videos"
},
{
"id": "pcmcat140000050036",
"name": "Listening to Digital Music"
},
{
"id": "pcmcat140000050037",
"name": "Computing Made Easy"
},
{
"id": "pcmcat140000050039",
"name": "Simple GPS Navigation"
},
{
"id": "pcmcat140000050040",
"name": "Playing Video Games"
},
{
"id": "pcmcat140000050041",
"name": "Watching HDTV"
},
.........
Как я могу получить и отобразить эту информацию в виде списка на моем устройстве? Я знаю о запросе службы $ http, но как мне включить это в ионный список?
Предполагая, что вы уже написали логику для получения данных, я написал этот JSBin для реализации ion-list
.
Предположим, вы собираетесь отображать поле имени в своем списке.
app.js
var baseURL="*here your json request*";
var categoriesName=[];
$http.get('baseURL')
.success(function(response){
$scope.objectResponse = response.categories;
console.log($scope.objectResponse);
$scope.objectResponse.forEach(function(item) {
categoriesName.push(item.name);
console.log(categoriesName);
})
.error(function(response){
console.log(response);
});
HTML
<ul class="list">
<li class="item" ng-repeat="listname in categoriesName">
{{listname}}
</li>
</ul>
Это как можно восстановить и отобразить эту информацию в виде списка на устройстве.