JSON @attributes和@association级别与js和/或angularjs
我目前正在使用API检索，更新和删除数据的项目。我使用的API是prestashop API。所以在能够检索数据和更新一些项目后，我偶然发现了一个问题。正如文档中所述，通过API发送和检索的所有数据都与json和xml由于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
回答：
从你的问题我的理解，这个问题正在访问内部ng-repeat的@attribute性能，请在下面的示例中使用ng-repeat显示@attribute值，我们还可以使用bracket notation而不是dot notation访问对象属性，更多地阅读here。
请让我知道这个答案是否有助于解决您的问题，或者如果我在我的答案中遗漏了某些东西。
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>
回答：
我认为你唯一的问题是用点号访问@属性，像这样 [email protected]
这不是有效的JavaScript，所以不是你应该使用的括号标记这个属性。
像这样：
product.associations.categories['@attributes']
回答：
你解决你的这个问题显然两种选择：
- 的预格式化的响应对象，以便在JSON所有的按键都是JS接受标识符。但在你的情况下这将是徒劳的。
- 其次是使用
Object[fieldName]符号而不是Object.fieldName，因为json中的键也可以是数字。介绍一下JS中的数组是索引对象。
以上是 JSON @attributes和@association级别与js和/或angularjs 的全部内容， 来源链接： utcz.com/qa/262724.html
