Извлекать и отображать данные из веб-сервиса в ionic / angularJS

0

Я создаю приложение с помощью ионного /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, но как мне включить это в ионный список?

  • 0
    сделать сервис, который вызывает эти данные, сохранить их в массиве
Теги:
ionic-framework

2 ответа

0
Лучший ответ

Предполагая, что вы уже написали логику для получения данных, я написал этот JSBin для реализации ion-list.

0

Предположим, вы собираетесь отображать поле имени в своем списке.

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>

Это как можно восстановить и отобразить эту информацию в виде списка на устройстве.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню