Подтвердить что ты не робот

JSON @атрибуты и уровни @association с js и/или угловыми

В настоящее время я работаю над проектом, который использует API для извлечения, обновления и удаления данных. API, который я использую, является API prestashop. Поэтому, получив возможность извлекать данные и обновлять некоторые элементы, я столкнулся с проблемой. Как сказано в документации, все данные, отправляемые и извлекаемые с помощью API, имеют json и xml Поскольку некоторые данные API имеют разные уровни возврата json, такие как уровни @attributes и @associations, я задал этот вопрос.

Дело в том, что я хотел бы получить доступ к этим данным и, в сочетании с angularjs, я хотел бы показать эти данные. Итак, позвольте мне показать вам быстрый пример того, чего я пытаюсь достичь.

Прежде всего, возвращение JSON будет примерно таким.

{"products":{"product":[{"id":"1","id_manufacturer":"1","id_supplier":"1","id_category_default":"5","new":{},"cache_default_attribute":"1","id_default_image":"1","id_default_combination":"1","id_tax_rules_group":"1","position_in_category":"0","manufacturer_name":"Fashion Manufacturer","quantity":"0","type":"simple","id_shop_default":"1","reference":"demo_1","supplier_reference":{},"location":{},"width":"0.000000","height":"0.000000","depth":"0.000000","weight":"0.000000","quantity_discount":"0","ean13":"333456789111","isbn":{},"upc":{},"cache_is_pack":"0","cache_has_attachments":"0","is_virtual":"0","state":"1","on_sale":"0","online_only":"0","ecotax":"0.000000","minimal_quantity":"1","price":"16.510000","wholesale_price":"4.950000","unity":{},"unit_price_ratio":"0.000000","additional_shipping_cost":"0.00","customizable":"0","text_fields":"0","uploadable_files":"0","active":"1","redirect_type":"404","id_type_redirected":"0","available_for_order":"1","available_date":"0000-00-00","show_condition":"0","condition":"new","show_price":"1","indexed":"1","visibility":"both","advanced_stock_management":"0","date_add":"2017-03-16 14:36:24","date_upd":"2017-12-01 13:01:13","pack_stock_type":"3","meta_description":{"language":{"@attributes":{"id":"1"}}},"meta_keywords":{"language":{"@attributes":{"id":"1"}}},"meta_title":{"language":{"@attributes":{"id":"1"}}},"link_rewrite":{"language":"gebleekte-T-shirts-met-korte-mouwen"},"name":{"language":"Gebleekte T-shirts met Korte Mouwen"},"description":{"language":"
Fashion maakt goed ontworpen collecties sinds 2010. Het merk biedt vrouwelijke combineerbare kleding en statement dresses en heeft een pr\u00eat-\u00e0-porter collectie ontwikkeld met kledingstukken die niet in een garderobe mogen ontbreken. Het resultaat? Cool, gemakkelijk, easy, chique met jeugdige elegantie en een duidelijk herkenbare stijl. Alle prachtige kledingstukken worden met de grootste zorg gemaakt in Itali\u00eb. Fashion breidt zijn aanbod uit met accessoires zoals schoenen, hoeden, riemen!<\/p>"},"description_short":{"language":"

Gebleekt T-shirt met korte mouwen en hoge halslijn. Zacht en elastisch materiaal zorgt voor een comfortabele pasvorm. Maak het af met een strooien hoed en u bent klaar voor de zomer!<\/p>"},"available_now":{"language":"Op voorraad"},"available_later":{"language":{"@attributes":{"id":"1"}}},"associations":{"categories":{"@attributes":{"nodeType":"category","api":"categories"},"category":[{"id":"2"},{"id":"3"},{"id":"4"},{"id":"5"}]},"images":{"@attributes":{"nodeType":"image","api":"images"},"image":[{"id":"1"},{"id":"2"},{"id":"3"},{"id":"4"}]},"combinations":{"@attributes":{"nodeType":"combination","api":"combinations"},"combination":[{"id":"1"},{"id":"2"},{"id":"3"},{"id":"4"},{"id":"5"},{"id":"6"}]},"product_option_values":{"@attributes":{"nodeType":"product_option_value","api":"product_option_values"},"product_option_value":[{"id":"1"},{"id":"13"},{"id":"14"},{"id":"2"},{"id":"3"}]},"product_features":{"@attributes":{"nodeType":"product_feature","api":"product_features"},"product_feature":[{"id":"5","id_feature_value":"5"},{"id":"6","id_feature_value":"11"},{"id":"7","id_feature_value":"17"}]},"tags":{"@attributes":{"nodeType":"tag","api":"tags"}},"stock_availables":{"@attributes":{"nodeType":"stock_available","api":"stock_availables"},"stock_available":[{"id":"1","id_product_attribute":"0"},{"id":"11","id_product_attribute":"1"},{"id":"12","id_product_attribute":"2"},{"id":"13","id_product_attribute":"3"},{"id":"22","id_product_attribute":"4"},{"id":"23","id_product_attribute":"5"},{"id":"24","id_product_attribute":"6"}]},"accessories":{"@attributes":{"nodeType":"product","api":"products"}},"product_bundle":{"@attributes":{"nodeType":"product","api":"products"}}}},

Структура упрощена

products {
product {
        id:
        name:
        category:
        ...
        @attributes {
            id:
            language:
            ...
        }
        @attributes {
            {"nodeType":"product_option_value","api":"product_option_values"},"product_option_value":[
                {"id":"1"},
                {"id":"11"},
                {"id":"8"}, 
                {"id":"2"},
                {"id":"3"}
                ]
            },
        }
    }
}

Используя $http.get() в Angularjs, я могу получить данные и использовать комбинацию ng-repeat и bind для отображения product_names. Теперь я хотел бы получить доступ к значениям @attribute и так далее. Но как я смогу получить к ним доступ? Есть ли конкретный способ сделать это? или это просто сделано путем доступа к уровню глубины объекта JSON?

Функция AngularJS для продуктов:

$http.get('config/get/getProducts.php', {cache: true}).then(function (response) {
        $scope.products = response.data.products.product
    });

Тогда в <html> я могу просто использовать:

<div ng-if="product.active == 1" class="productimg col-4" ng-repeat="product in products | filter : {id_category_default: catFilter.id}: true | filter:productSearch | filter:product.name | orderBy: 'name'">
    <p ng-bind="product.name.language"></p>
</div>

ОБНОВЛЕНИЕ: 01/02/2018 Так что после прочтения и тестирования некоторых комментариев я нашел разумное решение. Я могу получить доступ к значениям @attributes и ассоциаций, но наткнулся на новую проблему. Возвращаемое значение для каждого фильтра - несколько значений id. Посмотрите на пример ниже.

<div class="col-lg-3" ng-repeat="value in products">
    <p ng-bind="value.associations.categories.category"></p>
</div>

Возвращает:

[{"id":"2"},{"id":"3"},{"id":"4"},{"id":"5"}]

[{"id":"2"},{"id":"3"},{"id":"4"},{"id":"5"}]

[{"id":"2"},{"id":"3"},{"id":"4"},{"id":"7"}]

Где каждый ряд [....] обозначает отдельный продукт. Теперь мне нужно получить эти значения только как числа, которые они есть, чтобы я мог сравнить их с соответствующими значениями идентификаторов из разных таблиц. Хороший результат будет:

2, 3, 4, 5

Вопрос в том, как я смогу добраться до этого решения?

Если кому-то интересно, почему и как. Я пытаюсь получить идентификатор option_values идентификатор category из продуктов из установки prestashop, и все это через веб-сервис prestashop.

4b9b3361

Ответ 1

Как я понимаю, вы хотели бы использовать ng-repeat с вложенными объектами JSON. Вам нужно будет использовать более одного повторителя, потому что один повторяющийся элемент может содержать несколько элементов, которые вы хотите отобразить.

Итак, насколько я могу видеть, что-то вроде этого должно работать:

<div ng-if="product.active == 1" class="productimg col-4" ng-repeat="product in products | filter : {id_category_default: catFilter.id}: true | filter:productSearch | filter:product.name | orderBy: 'name'">
    <p ng-bind="product.name.language"></p>
    <table ng-repeat="cat in product.associations.categories">
        <tr ng-repeat="attr in [email protected]">
            <td >{{attr.nodeType}}</td>
            <td >{{attr.api}}</td>
        </tr>
    </table>
</div>

Посмотрите здесь: https://www.aspsnippets.com/Articles/AngularJS-Using-ng-repeat-with-Complex-Nested-JSON-objects.aspx

Ответ 2

Я думаю, что ваша единственная проблема - доступ к @attributes с точечной нотацией, например, [email protected]

это недопустимый JavaScript, поэтому вместо этого вы должны использовать скобочные обозначения для этих атрибутов.

как это: product.associations.categories['@attributes']

Ответ 3

Из вашего вопроса я понимаю, что проблема заключается в доступе к свойствам @attribute внутри ng-repeat. Ниже приведен пример, показывающий значения @attribute с помощью ng-repeat, мы также можем получить доступ к свойствам объекта, используя bracket notation вместо dot notation, читайте здесь.

Пожалуйста, дайте мне знать, помог ли этот ответ решить вашу проблему, или если я пропустил что-то в своем ответе.

var app = angular.module('myapp', []);

app.controller('MainCtrl', function($scope) {
  $scope.products = [{
    "id": "1",
    "id_manufacturer": "1",
    "id_supplier": "1",
    "id_category_default": "5",
    "new": {

    },
    "cache_default_attribute": "1",
    "id_default_image": "1",
    "id_default_combination": "1",
    "id_tax_rules_group": "1",
    "position_in_category": "0",
    "manufacturer_name": "Fashion Manufacturer",
    "quantity": "0",
    "type": "simple",
    "id_shop_default": "1",
    "reference": "demo_1",
    "supplier_reference": {

    },
    "location": {

    },
    "width": "0.000000",
    "height": "0.000000",
    "depth": "0.000000",
    "weight": "0.000000",
    "quantity_discount": "0",
    "ean13": "333456789111",
    "isbn": {

    },
    "upc": {

    },
    "cache_is_pack": "0",
    "cache_has_attachments": "0",
    "is_virtual": "0",
    "state": "1",
    "on_sale": "0",
    "online_only": "0",
    "ecotax": "0.000000",
    "minimal_quantity": "1",
    "price": "16.510000",
    "wholesale_price": "4.950000",
    "unity": {

    },
    "unit_price_ratio": "0.000000",
    "additional_shipping_cost": "0.00",
    "customizable": "0",
    "text_fields": "0",
    "uploadable_files": "0",
    "active": "1",
    "redirect_type": "404",
    "id_type_redirected": "0",
    "available_for_order": "1",
    "available_date": "0000-00-00",
    "show_condition": "0",
    "condition": "new",
    "show_price": "1",
    "indexed": "1",
    "visibility": "both",
    "advanced_stock_management": "0",
    "date_add": "2017-03-16 14:36:24",
    "date_upd": "2017-12-01 13:01:13",
    "pack_stock_type": "3",
    "meta_description": {
      "language": {
        "@attributes": {
          "id": "1"
        }
      }
    },
    "meta_keywords": {
      "language": {
        "@attributes": {
          "id": "1"
        }
      }
    },
    "meta_title": {
      "language": {
        "@attributes": {
          "id": "1"
        }
      }
    },
    "link_rewrite": {
      "language": "gebleekte-T-shirts-met-korte-mouwen"
    },
    "name": {
      "language": "Gebleekte T-shirts met Korte Mouwen"
    },
    "description": {
      "language": "Fashion maakt goed ontworpen collecties sinds 2010. Het merk biedt vrouwelijke combineerbare kleding en statement dresses en heeft een pr\u00eat-\u00e0-porter collectie ontwikkeld met kledingstukken die niet in een garderobe mogen ontbreken. Het resultaat? Cool, gemakkelijk, easy, chique met jeugdige elegantie en een duidelijk herkenbare stijl. Alle prachtige kledingstukken worden met de grootste zorg gemaakt in Itali\u00eb. Fashion breidt zijn aanbod uit met accessoires zoals schoenen, hoeden, riemen!<\/p>"
    },
    "description_short": {
      "language": "Gebleekt T-shirt met korte mouwen en hoge halslijn. Zacht en elastisch materiaal zorgt voor een comfortabele pasvorm. Maak het af met een strooien hoed en u bent klaar voor de zomer!<\/p>"
    },
    "available_now": {
      "language": "Op voorraad"
    },
    "available_later": {
      "language": {
        "@attributes": {
          "id": "1"
        }
      }
    },
    "associations": {
      "categories": {
        "@attributes": {
          "nodeType": "category",
          "api": "categories"
        },
        "category": [{
            "id": "2"
          },
          {
            "id": "3"
          },
          {
            "id": "4"
          },
          {
            "id": "5"
          }
        ]
      },
      "images": {
        "@attributes": {
          "nodeType": "image",
          "api": "images"
        },
        "image": [{
            "id": "1"
          },
          {
            "id": "2"
          },
          {
            "id": "3"
          },
          {
            "id": "4"
          }
        ]
      },
      "combinations": {
        "@attributes": {
          "nodeType": "combination",
          "api": "combinations"
        },
        "combination": [{
            "id": "1"
          },
          {
            "id": "2"
          },
          {
            "id": "3"
          },
          {
            "id": "4"
          },
          {
            "id": "5"
          },
          {
            "id": "6"
          }
        ]
      },
      "product_option_values": {
        "@attributes": {
          "nodeType": "product_option_value",
          "api": "product_option_values"
        },
        "product_option_value": [{
            "id": "1"
          },
          {
            "id": "13"
          },
          {
            "id": "14"
          },
          {
            "id": "2"
          },
          {
            "id": "3"
          }
        ]
      },
      "product_features": {
        "@attributes": {
          "nodeType": "product_feature",
          "api": "product_features"
        },
        "product_feature": [{
            "id": "5",
            "id_feature_value": "5"
          },
          {
            "id": "6",
            "id_feature_value": "11"
          },
          {
            "id": "7",
            "id_feature_value": "17"
          }
        ]
      },
      "tags": {
        "@attributes": {
          "nodeType": "tag",
          "api": "tags"
        }
      },
      "stock_availables": {
        "@attributes": {
          "nodeType": "stock_available",
          "api": "stock_availables"
        },
        "stock_available": [{
            "id": "1",
            "id_product_attribute": "0"
          },
          {
            "id": "11",
            "id_product_attribute": "1"
          },
          {
            "id": "12",
            "id_product_attribute": "2"
          },
          {
            "id": "13",
            "id_product_attribute": "3"
          },
          {
            "id": "22",
            "id_product_attribute": "4"
          },
          {
            "id": "23",
            "id_product_attribute": "5"
          },
          {
            "id": "24",
            "id_product_attribute": "6"
          }
        ]
      },
      "accessories": {
        "@attributes": {
          "nodeType": "product",
          "api": "products"
        }
      },
      "product_bundle": {
        "@attributes": {
          "nodeType": "product",
          "api": "products"
        }
      }
    }
  }];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="MainCtrl" ng-app="myapp">
  <div ng-if="product.active == 1" class="productimg col-4" ng-repeat="product in products | filter : {id_category_default: catFilter.id}: true | filter:productSearch | filter:product.name | orderBy: 'name'">
    <p ng-bind="product.name.language"></p>
    <div ng-repeat="(key,value) in product['meta_title']['language']['@attributes']">
      Key: {{key}} , Value: {{value}}
    </div>
  </div>
</div>

Ответ 4

У вас есть два варианта решения этих проблем:

  • Предварительная форматирование объекта ответа, чтобы все ключи в JSON были JS-принятыми идентификаторами. Но это будет бесполезной работой в вашем сценарии.
  • Вторая использует нотацию Object[fieldName] вместо Object.fieldName, потому что ключ в json также может быть числом. Имейте в виду, что массив в JS является проиндексированным объектом.