• 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧

JSON @attributes和@association级别与js和/或angularjs

JavaScript 来源:Deathstorm 4次浏览

我目前正在使用API​​检索,更新和删除数据的项目。我使用的API是prestashop API。所以在能够检索数据和更新一些项目后,我偶然发现了一个问题。正如文档中所述,通过API发送和检索的所有数据都与jsonxml由于API的某些数据在json返回中具有不同的级别,例如@attributes和@associations级别,所以我提出了这个问题。JSON @attributes和@association级别与js和/或angularjs

事情是我想访问这些数据,并结合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重复和绑定组合,以显示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> 

更新:2018年1月2日 所以阅读和测试后,一些我提出了一个合理的解决方案。我能够访问@属性和关联值,但我偶然发现了一个新问题。我为每个过滤器获得的回报是多个“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"}] 

其中的每一行[..]代表不同的产品。现在我需要将这些值作为唯一的数字,以便我可以将它们与来自不同表格的相应ID值进行比较。一个好的结果是:

2, 3, 4, 5 

问题是我将如何能够得到这个解决方案?

如果有人对为什么和如何感兴趣。我试图从prestashop安装的产品中检索option_values的id和category的id,以及所有通过prestashop webservice的产品。

我在这个问题上增加了另一个赏金。

如果有任何问题,请在评论中提问。 在此先感谢!


===========解决方案如下:

据我所知,你想用嵌套的JSON对象ng-repeat。您需要使用多个中继器,因为一个重复的项目可以包含您想要显示的多个项目。

所以只要我能看到这样的事情应该工作:

<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


版权声明:本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系管理员进行删除。
喜欢 (0)