I have 2 api:
Having bank details
Other having user account detail.
User can have more than 1 account with 1 bank. I have to fetch bank name and logo from bank api, and show all the user accounts with name, amount banks name and logo.
Two api data looks like below :
Bank API:
[
{
"id": 2,
"name": "KlikBCA",
"bank_code": "KlikBCA",
"country_code": "ID",
"country_name": "India",
"logo": "url",
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
},
{
"id": 7,
"name": "BNI Internet Banking",
"bank_code": "BNI Internet Banking",
"country_code": "ID",
"country_name": "Indis",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}
]
User API:
[
{
"id": "sdf",
"bankId": "7",
"data": [
{
"accountId": “1234”,
"accountHolder": "John Doe",
"accountNumber": "587-2673-989",
"balances": {
"available": 500000,
}
},
{
"accountId": “2345”,
"accountHolder": "John Doe",
"accountNumber": "987-0675-789",
"balances": {
"available": 7500000
}
}
]
},
{
"id": "f230",
"bankId": "3",
"data": [
{
"accountId": "9876",
"accountHolder": "Charls",
"accountNumber": "765-6543-345",
"balances": {
"available": 200000
}
}
]
}
]
i need data to be like this..so that I can use it in my next component, which will take each account with all the bank details.
[
{
"id": "sdf",
"bankId": "7",
"data":
{
"accountId": “1234”,
"accountHolder": "John Doe",
"accountNumber": "587-2673-989",
"balances": {
"available": 500000,
}
},
"bank":{
"id": 7,
"name": "BNI Internet Banking",
"bank_code": "BNI Internet Banking",
"country_code": "ID",
"country_name": "Indis",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}
},
{"id": "sdf",
"bankId": "7",
"data": {
"accountId": “2345”,
"accountHolder": "John Doe",
"accountNumber": "987-0675-789",
"balances": {
"available": 7500000
}
},
"bank":{
"id": 7,
"name": "BNI Internet Banking",
"bank_code": "BNI Internet Banking",
"country_code": "ID",
"country_name": "Indis",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}
},
{
"id": "f230",
"bankId": "3",
"data": {
"accountId": "9876",
"accountHolder": "Charls",
"accountNumber": "765-6543-345",
"balances": {
"available": 200000
},
"bank":{
"name": "Mandiri",
"bank_code": "Mandiri",
"country_code": "ID",
"country_name": "India",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}
}
}
]
You can use loop to merge two api json into one,
this is my code.
hope I can help u.
const banks = [{
"id": 2,
"name": "KlikBCA",
"bank_code": "KlikBCA",
"country_code": "ID",
"country_name": "India",
"logo": "url",
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}, {
"id": 3,
"name": "Mandiri",
"bank_code": "Mandiri",
"country_code": "ID",
"country_name": "India",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}, {
"id": 7,
"name": "BNI Internet Banking",
"bank_code": "BNI Internet Banking",
"country_code": "ID",
"country_name": "Indis",
"primary_color": "url",
"logo": null,
"createdAt": null,
"updatedAt": "2021-07-26T14:58:03.000+00:00",
"channels": null
}]
const users = [{
"id": "sdf",
"bankId": "7",
"data": [{
"accountId": "1234",
"accountHolder": "John Doe",
"accountNumber": "587-2673-989",
"balances": {
"available": 500000,
}
}, {
"accountId": "2345",
"accountHolder": "John Doe",
"accountNumber": "987-0675-789",
"balances": {
"available": 7500000
}
}]
}, {
"id": "f230",
"bankId": "3",
"data": [{
"accountId": "9876",
"accountHolder": "Charls",
"accountNumber": "765-6543-345",
"balances": {
"available": 200000
}
}]
}]
let resultApi = users.map(u => {
const t = banks.find(b => b.id == u.bankId) || {}
return {
...u,
...t
}
})
console.log(resultApi);
first of all, a feedback, you should write json inside code blocks for readability.
your question seems incomplete as what you want to achieve? you want to show these data in UI (html) or create a new json? and how far have you tried?
try to share a codesandbox/codepen link.
remember, you need to loop through both the arrays and first store bank data inside user's account by matching user.bankId === bank.id and then with the new data set you can show it wherever you want. give it a try first and then let us know in comments if you're unable to achieve.
So i've been using the microsoft bookings Beta Api getting the List from this URL:
GET https://graph.microsoft.com/beta/bookingBusinesses/Contosolunchdelivery#M365B489948.onmicrosoft.com/appointments
it works fine except i need to get the start -> dateTime and end -> dateTime for the specific appointment but its returning wrong start dates? even though when i go to bookings i clearly put the start time.
This is what the JSON-Example should looks like:
{
"#odata.context": "https://graph.microsoft.com/beta/$metadata#bookingBusinesses('Contosolunchdelivery%40M365B489948.onmicrosoft.com')/appointments",
"value": [
{
"id": "AAMkADKoAAA=",
"selfServiceAppointmentId": "00000000-0000-0000-0000-000000000000",
"customerId": "829e3cb5-3d4d-4319-a8de-1953aedaa166",
"customerName": "Bob Kelly",
"customerEmailAddress": "bobk#tailspintoys.com",
"customerPhone": "213-555-0108",
"customerNotes": null,
"serviceId": "57da6774-a087-4d69-b0e6-6fb82c339976",
"serviceName": "Catered bento",
"duration": "PT30M",
"preBuffer": "PT5M",
"postBuffer": "PT10M",
"priceType": "fixedPrice",
"price": 10,
"serviceNotes": null,
"optOutOfCustomerEmail": false,
"staffMemberIds": [],
"invoiceAmount": 10,
"invoiceId": "1002",
"invoiceStatus": "open",
"invoiceUrl": "theInvoiceUrl",
"customerLocation": {
"displayName": "Customer",
"locationEmailAddress": null,
"locationUri": "",
"locationType": null,
"uniqueId": null,
"uniqueIdType": null,
"address": {
"type": "home",
"postOfficeBox": "",
"street": "",
"city": "",
"state": "",
"countryOrRegion": "",
"postalCode": ""
},
"coordinates": {
"altitude": null,
"latitude": null,
"longitude": null,
"accuracy": null,
"altitudeAccuracy": null
}
},
"start": {
"dateTime": "2018-04-30T13:00:00.0000000Z",
"timeZone": "UTC"
},
"end": {
"dateTime": "2018-04-30T13:30:00.0000000Z",
"timeZone": "UTC"
},
"serviceLocation": {
"displayName": "Customer location (987 Third Avenue, Buffalo, NY 98052, USA)",
"locationEmailAddress": null,
"locationUri": "",
"locationType": null,
"uniqueId": null,
"uniqueIdType": null,
"address": {
"type": "home",
"postOfficeBox": "",
"street": "",
"city": "",
"state": "",
"countryOrRegion": "",
"postalCode": ""
},
"coordinates": {
"altitude": null,
"latitude": null,
"longitude": null,
"accuracy": null,
"altitudeAccuracy": null
}
},
"reminders": [],
"invoiceDate": {
"dateTime": "2018-04-30T13:30:00.0000000Z",
"timeZone": "UTC"
}
},
{
"id": "AAMkADKnAAA=",
"selfServiceAppointmentId": "00000000-0000-0000-0000-000000000000",
"customerId": "7ed53fa5-9ef2-4f2f-975b-27447440bc09",
"customerName": "Jordan Miller",
"customerEmailAddress": "jordanm#contoso.com",
"customerPhone": "213-555-0199",
"customerNotes": null,
"serviceId": "57da6774-a087-4d69-b0e6-6fb82c339976",
"serviceName": "Catered bento",
"duration": "PT30M",
"preBuffer": "PT5M",
"postBuffer": "PT10M",
"priceType": "fixedPrice",
"price": 10,
"serviceNotes": null,
"optOutOfCustomerEmail": false,
"staffMemberIds": [],
"invoiceAmount": 10,
"invoiceId": "1001",
"invoiceStatus": "open",
"invoiceUrl": "theInvoiceUrl",
"customerLocation": {
"displayName": "Customer",
"locationEmailAddress": null,
"locationUri": "",
"locationType": null,
"uniqueId": null,
"uniqueIdType": null,
"address": {
"type": "home",
"postOfficeBox": "",
"street": "",
"city": "",
"state": "",
"countryOrRegion": "",
"postalCode": ""
},
"coordinates": {
"altitude": null,
"latitude": null,
"longitude": null,
"accuracy": null,
"altitudeAccuracy": null
}
},
"start": {
"dateTime": "2018-05-01T12:00:00.0000000Z",
"timeZone": "UTC"
},
"end": {
"dateTime": "2018-05-01T12:30:00.0000000Z",
"timeZone": "UTC"
},
"serviceLocation": {
"displayName": "Customer location (123 First Avenue, Buffalo, NY 98052, USA)",
"locationEmailAddress": null,
"locationUri": "",
"locationType": null,
"uniqueId": null,
"uniqueIdType": null,
"address": {
"type": "home",
"postOfficeBox": "",
"street": "",
"city": "",
"state": "",
"countryOrRegion": "",
"postalCode": ""
},
"coordinates": {
"altitude": null,
"latitude": null,
"longitude": null,
"accuracy": null,
"altitudeAccuracy": null
}
},
"reminders": [],
"invoiceDate": {
"dateTime": "2018-05-01T12:30:00.0000000Z",
"timeZone": "UTC"
}
}
]
}
And this is what im getting for the start and end date time:
start:
dateTime: "0001-01-01T00:00:00.0000000Z"
timeZone: "Etc/UTC"
end:
dateTime: "0001-01-01T00:00:00.0000000Z"
timeZone: "Etc/UTC"
I dont know what i'm doing wrong, i'd appreciate any help.
So for some reason using this URL:
GET /bookingBusinesses/{id}/calendarView?start={start-value}&end={end-value}
did end up giving me the exact results i was looking with correct time and everything the list appointments url was giving me.
I guess that's why this is still in BETA
I'm trying to output all of the customer id's within my JSON data. I am using ejs as my templating engine. So far I'm only able to succsefully output 1 customer id via:
<p><%= jsonOrderData.orders[0].customer.id %></p>
When I try to loop through each order I get Cannot read property 'id' of undefined
for loop to loop through
<% for (var i = 0; i < jsonOrderData.orders.length; i++) {%>
<p>Customer: <%= jsonOrderData.orders[i].customer.id %></p>
<% }; %>
If I remove the .id after customer the error then goes away. It then outputs
Customer:[object Object] 50 times which is the legth of the json data.
I don't understand why it's not working within the loop when adding .id when it works fine without the loop manually setting the index?
JSON DATA (Cut Down 2 Orders)
{
"orders": [
{
"id": 533078016054,
"email": "email#gmail.com",
"closed_at": null,
"created_at": "2018-08-10T05:03:36+01:00",
"updated_at": "2018-08-10T05:03:37+01:00",
"number": 52,
"note": "",
"token": "f4877048c08eb98180ee5fda34f978bc",
"gateway": "manual",
"test": false,
"total_price": "13.98",
"subtotal_price": "13.98",
"total_weight": 0,
"total_tax": "0.00",
"taxes_included": false,
"currency": "GBP",
"financial_status": "pending",
"confirmed": true,
"total_discounts": "0.00",
"total_line_items_price": "13.98",
"cart_token": null,
"buyer_accepts_marketing": false,
"name": "#MW1052",
"referring_site": null,
"landing_site": null,
"cancelled_at": null,
"cancel_reason": null,
"total_price_usd": "18.00",
"checkout_token": null,
"reference": null,
"user_id": 1706983449,
"location_id": null,
"source_identifier": null,
"source_url": null,
"processed_at": "2018-08-10T05:03:36+01:00",
"device_id": null,
"phone": null,
"customer_locale": null,
"app_id": 1354745,
"browser_ip": null,
"landing_site_ref": null,
"order_number": 1052,
"discount_applications": [],
"discount_codes": [],
"note_attributes": [],
"payment_gateway_names": [
"manual"
],
"processing_method": "manual",
"checkout_id": null,
"source_name": "shopify_draft_order",
"fulfillment_status": null,
"tax_lines": [],
"tags": "",
"contact_email": "email#gmail.com",
"order_status_url": "https://checkout.shopify.com/1245839385/orders/f4877048c08eb98180ee5fda34f978bc/authenticate?key=redacted",
"admin_graphql_api_id": "gid://shopify/Order/redacted",
"line_items": [
{
"id": 1350736445494,
"variant_id": 8725905539126,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss15",
"variant_title": "S / Bottle Green",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Bottle Green",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350736445494",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
},
{
"id": 1350736478262,
"variant_id": 8725905440822,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss12",
"variant_title": "S / Heather Grey",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Heather Grey",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350736478262",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
}
],
"shipping_lines": [],
"billing_address": {
"first_name": "John",
"address1": "17A Oaklands Business Centre",
"phone": null,
"city": "Worthing",
"zip": "BN11 5LH",
"province": null,
"country": "United Kingdom",
"last_name": "Doe",
"address2": "Elm Grove",
"company": null,
"latitude": 50.8162744,
"longitude": -0.4010653,
"name": "Jogn Doe",
"country_code": "GB",
"province_code": null
},
"shipping_address": {
"first_name": "John",
"address1": "17A Oaklands Business Centre",
"phone": null,
"city": "Worthing",
"zip": "BN11 5LH",
"province": null,
"country": "United Kingdom",
"last_name": "Doe",
"address2": "Elm Grove",
"company": null,
"latitude": 50.8162744,
"longitude": -0.4010653,
"name": "John Doe",
"country_code": "GB",
"province_code": null
},
"fulfillments": [],
"refunds": [],
"customer": {
"id": 556974014518,
"email": "email#gmail.com",
"accepts_marketing": false,
"created_at": "2018-06-26T00:26:55+01:00",
"updated_at": "2018-08-10T05:03:36+01:00",
"first_name": "John",
"last_name": "Doe",
"orders_count": 22,
"state": "enabled",
"total_spent": "0.00",
"last_order_id": 533078016054,
"note": null,
"verified_email": true,
"multipass_identifier": null,
"tax_exempt": false,
"phone": null,
"tags": "",
"last_order_name": "#MW1052",
"admin_graphql_api_id": "gid://shopify/Customer/556974014518",
"default_address": {
"id": 601657278518,
"customer_id": 556974014518,
"first_name": "John",
"last_name": "Doe",
"company": null,
"address1": "17A Oaklands Business Centre",
"address2": "Elm Grove",
"city": "Worthing",
"province": null,
"country": "United Kingdom",
"zip": "BN11 5LH",
"phone": null,
"name": "John Doe",
"province_code": null,
"country_code": "GB",
"country_name": "United Kingdom",
"default": true
}
}
},
{
"id": 532977778742,
"email": "james#bungeedesign.com",
"closed_at": null,
"created_at": "2018-08-09T22:18:53+01:00",
"updated_at": "2018-08-09T22:18:53+01:00",
"number": 51,
"note": "",
"token": "a292d75bd7011cf255a1bf236b23d0a5",
"gateway": "manual",
"test": false,
"total_price": "6.99",
"subtotal_price": "6.99",
"total_weight": 0,
"total_tax": "0.00",
"taxes_included": false,
"currency": "GBP",
"financial_status": "pending",
"confirmed": true,
"total_discounts": "0.00",
"total_line_items_price": "6.99",
"cart_token": null,
"buyer_accepts_marketing": true,
"name": "#MW1051",
"referring_site": null,
"landing_site": null,
"cancelled_at": null,
"cancel_reason": null,
"total_price_usd": "9.00",
"checkout_token": null,
"reference": null,
"user_id": 1706983449,
"location_id": 1327759385,
"source_identifier": null,
"source_url": null,
"processed_at": "2018-08-09T22:18:53+01:00",
"device_id": null,
"phone": null,
"customer_locale": null,
"app_id": 1354745,
"browser_ip": null,
"landing_site_ref": null,
"order_number": 1051,
"discount_applications": [],
"discount_codes": [],
"note_attributes": [],
"payment_gateway_names": [
"manual"
],
"processing_method": "manual",
"checkout_id": null,
"source_name": "shopify_draft_order",
"fulfillment_status": null,
"tax_lines": [],
"tags": "",
"contact_email": "james#bungeedesign.com",
"order_status_url": "https://checkout.shopify.com/1245839385/orders/a292d75bd7011cf255a1bf236b23d0a5/authenticate?key=9322877ce6ce34be2feeb127d73d0f89",
"admin_graphql_api_id": "gid://shopify/Order/532977778742",
"line_items": [
{
"id": 1350552453174,
"variant_id": 8725905408054,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss11",
"variant_title": "S / Black",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Black",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350552453174",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
}
],
"shipping_lines": [],
"fulfillments": [],
"refunds": [],
"customer": {
"id": 552537620534,
"email": "james#bungeedesign.com",
"accepts_marketing": true,
"created_at": "2018-06-15T10:44:13+01:00",
"updated_at": "2018-08-09T22:18:53+01:00",
"first_name": "James",
"last_name": "Rogers",
"orders_count": 18,
"state": "enabled",
"total_spent": "0.00",
"last_order_id": 532977778742,
"note": null,
"verified_email": true,
"multipass_identifier": null,
"tax_exempt": false,
"phone": null,
"tags": "password page, prospect",
"last_order_name": "#MW1051",
"admin_graphql_api_id": "gid://shopify/Customer/552537620534"
}
}
]
}
What you have runs fine. It might be possible that something is getting lost in translation or .id is at another level. My guess is that you are not setting the variable jsonOrderData as you are expecting.
If you do console.log(jsonOrderData); do you get what you expect?
This works fine:
const json = {
"orders": [
{
"id": 533078016054,
"email": "email#gmail.com",
"closed_at": null,
"created_at": "2018-08-10T05:03:36+01:00",
"updated_at": "2018-08-10T05:03:37+01:00",
"number": 52,
"note": "",
"token": "f4877048c08eb98180ee5fda34f978bc",
"gateway": "manual",
"test": false,
"total_price": "13.98",
"subtotal_price": "13.98",
"total_weight": 0,
"total_tax": "0.00",
"taxes_included": false,
"currency": "GBP",
"financial_status": "pending",
"confirmed": true,
"total_discounts": "0.00",
"total_line_items_price": "13.98",
"cart_token": null,
"buyer_accepts_marketing": false,
"name": "#MW1052",
"referring_site": null,
"landing_site": null,
"cancelled_at": null,
"cancel_reason": null,
"total_price_usd": "18.00",
"checkout_token": null,
"reference": null,
"user_id": 1706983449,
"location_id": null,
"source_identifier": null,
"source_url": null,
"processed_at": "2018-08-10T05:03:36+01:00",
"device_id": null,
"phone": null,
"customer_locale": null,
"app_id": 1354745,
"browser_ip": null,
"landing_site_ref": null,
"order_number": 1052,
"discount_applications": [],
"discount_codes": [],
"note_attributes": [],
"payment_gateway_names": [
"manual"
],
"processing_method": "manual",
"checkout_id": null,
"source_name": "shopify_draft_order",
"fulfillment_status": null,
"tax_lines": [],
"tags": "",
"contact_email": "email#gmail.com",
"order_status_url": "https://checkout.shopify.com/1245839385/orders/f4877048c08eb98180ee5fda34f978bc/authenticate?key=redacted",
"admin_graphql_api_id": "gid://shopify/Order/redacted",
"line_items": [
{
"id": 1350736445494,
"variant_id": 8725905539126,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss15",
"variant_title": "S / Bottle Green",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Bottle Green",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350736445494",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
},
{
"id": 1350736478262,
"variant_id": 8725905440822,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss12",
"variant_title": "S / Heather Grey",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Heather Grey",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350736478262",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
}
],
"shipping_lines": [],
"billing_address": {
"first_name": "John",
"address1": "17A Oaklands Business Centre",
"phone": null,
"city": "Worthing",
"zip": "BN11 5LH",
"province": null,
"country": "United Kingdom",
"last_name": "Doe",
"address2": "Elm Grove",
"company": null,
"latitude": 50.8162744,
"longitude": -0.4010653,
"name": "Jogn Doe",
"country_code": "GB",
"province_code": null
},
"shipping_address": {
"first_name": "John",
"address1": "17A Oaklands Business Centre",
"phone": null,
"city": "Worthing",
"zip": "BN11 5LH",
"province": null,
"country": "United Kingdom",
"last_name": "Doe",
"address2": "Elm Grove",
"company": null,
"latitude": 50.8162744,
"longitude": -0.4010653,
"name": "John Doe",
"country_code": "GB",
"province_code": null
},
"fulfillments": [],
"refunds": [],
"customer": {
"id": 556974014518,
"email": "email#gmail.com",
"accepts_marketing": false,
"created_at": "2018-06-26T00:26:55+01:00",
"updated_at": "2018-08-10T05:03:36+01:00",
"first_name": "John",
"last_name": "Doe",
"orders_count": 22,
"state": "enabled",
"total_spent": "0.00",
"last_order_id": 533078016054,
"note": null,
"verified_email": true,
"multipass_identifier": null,
"tax_exempt": false,
"phone": null,
"tags": "",
"last_order_name": "#MW1052",
"admin_graphql_api_id": "gid://shopify/Customer/556974014518",
"default_address": {
"id": 601657278518,
"customer_id": 556974014518,
"first_name": "John",
"last_name": "Doe",
"company": null,
"address1": "17A Oaklands Business Centre",
"address2": "Elm Grove",
"city": "Worthing",
"province": null,
"country": "United Kingdom",
"zip": "BN11 5LH",
"phone": null,
"name": "John Doe",
"province_code": null,
"country_code": "GB",
"country_name": "United Kingdom",
"default": true
}
}
},
{
"id": 532977778742,
"email": "james#bungeedesign.com",
"closed_at": null,
"created_at": "2018-08-09T22:18:53+01:00",
"updated_at": "2018-08-09T22:18:53+01:00",
"number": 51,
"note": "",
"token": "a292d75bd7011cf255a1bf236b23d0a5",
"gateway": "manual",
"test": false,
"total_price": "6.99",
"subtotal_price": "6.99",
"total_weight": 0,
"total_tax": "0.00",
"taxes_included": false,
"currency": "GBP",
"financial_status": "pending",
"confirmed": true,
"total_discounts": "0.00",
"total_line_items_price": "6.99",
"cart_token": null,
"buyer_accepts_marketing": true,
"name": "#MW1051",
"referring_site": null,
"landing_site": null,
"cancelled_at": null,
"cancel_reason": null,
"total_price_usd": "9.00",
"checkout_token": null,
"reference": null,
"user_id": 1706983449,
"location_id": 1327759385,
"source_identifier": null,
"source_url": null,
"processed_at": "2018-08-09T22:18:53+01:00",
"device_id": null,
"phone": null,
"customer_locale": null,
"app_id": 1354745,
"browser_ip": null,
"landing_site_ref": null,
"order_number": 1051,
"discount_applications": [],
"discount_codes": [],
"note_attributes": [],
"payment_gateway_names": [
"manual"
],
"processing_method": "manual",
"checkout_id": null,
"source_name": "shopify_draft_order",
"fulfillment_status": null,
"tax_lines": [],
"tags": "",
"contact_email": "james#bungeedesign.com",
"order_status_url": "https://checkout.shopify.com/1245839385/orders/a292d75bd7011cf255a1bf236b23d0a5/authenticate?key=9322877ce6ce34be2feeb127d73d0f89",
"admin_graphql_api_id": "gid://shopify/Order/532977778742",
"line_items": [
{
"id": 1350552453174,
"variant_id": 8725905408054,
"title": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt",
"quantity": 1,
"price": "6.99",
"sku": "ss11",
"variant_title": "S / Black",
"vendor": "Fruit Of The Loom",
"fulfillment_service": "manual",
"product_id": 719146287158,
"requires_shipping": true,
"taxable": false,
"gift_card": false,
"name": "Fruit of the Loom Poly/Cotton Piqué Polo Shirt - S / Black",
"variant_inventory_management": "shopify",
"properties": [],
"product_exists": true,
"fulfillable_quantity": 1,
"grams": 0,
"total_discount": "0.00",
"fulfillment_status": null,
"discount_allocations": [],
"admin_graphql_api_id": "gid://shopify/LineItem/1350552453174",
"tax_lines": [
{
"title": "VAT",
"price": "0.00",
"rate": 0.2
}
]
}
],
"shipping_lines": [],
"fulfillments": [],
"refunds": [],
"customer": {
"id": 552537620534,
"email": "james#bungeedesign.com",
"accepts_marketing": true,
"created_at": "2018-06-15T10:44:13+01:00",
"updated_at": "2018-08-09T22:18:53+01:00",
"first_name": "James",
"last_name": "Rogers",
"orders_count": 18,
"state": "enabled",
"total_spent": "0.00",
"last_order_id": 532977778742,
"note": null,
"verified_email": true,
"multipass_identifier": null,
"tax_exempt": false,
"phone": null,
"tags": "password page, prospect",
"last_order_name": "#MW1051",
"admin_graphql_api_id": "gid://shopify/Customer/552537620534"
}
}
]
};
for (let i = 0; i < json.orders.length; i++) {
const order = json.orders[i];
console.log(order.customer.id);
}
I have a situation where I'm getting list of complex JSON data(nested type).I'm new to AngularJS, not getting solution to run ng-repeat or forEach over that.
My returned data is like below.
[{
"studPersonalDetails": {
"id": 0,
"name": "Digvijay",
"middleName": "",
"lastName": "Singh",
"fatherName": "abac",
"motherName": "abc",
"dob": "5/7/1990 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "12",
"address2": "12",
"city": "21",
"state": "212",
"pin": 2
},
"courseDetails": {
"courseID": 12,
"courseName": "12",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "qw"
}
}, {
"studPersonalDetails": {
"id": 0,
"name": "Anil",
"middleName": "kumar",
"lastName": "Sharma",
"fatherName": "bac",
"motherName": "bac",
"dob": "2/11/1989 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "21",
"address2": "21",
"city": "5456",
"state": "8",
"pin": 7
},
"courseDetails": {
"courseID": 58,
"courseName": "58",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "abc"
}
}]
This is the response returned by API.
Any help would be appreciated!Thanks!!
You can try something like this:
JSFiddle.
<div ng-repeat="currentRow in data">
<span>{{currentRow.studPersonalDetails.name}}</span>
<span>{{currentRow.studPersonalDetails.lastName}}</span>
</div>
$scope.arr = [{
"studPersonalDetails": {
"id": 0,
"name": "Digvijay",
"middleName": "",
"lastName": "Singh",
"fatherName": "Shyam Bahadur Singh",
"motherName": "ramawati Devi",
"dob": "5/7/1990 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "12",
"address2": "12",
"city": "21",
"state": "212",
"pin": 2
},
"courseDetails": {
"courseID": 12,
"courseName": "12",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "qw"
}
}, {
"studPersonalDetails": {
"id": 0,
"name": "Anil",
"middleName": "kumar",
"lastName": "Sharma",
"fatherName": "bac",
"motherName": "bac",
"dob": "2/11/1989 12:00:00 AM"
},
"clients": {
"clientID": 1,
"clientName": null,
"clientDescriptions": null
},
"studentAddress": {
"address1": "21",
"address2": "21",
"city": "5456",
"state": "8",
"pin": 7
},
"courseDetails": {
"courseID": 58,
"courseName": "58",
"courseDetail": null
},
"studentContacts": {
"email": "12",
"alternatePhone": "12",
"phone": "abc"
}
}]
Using angular.forEach you can do it like this.
angular.forEach($scope.arr,function(value,key){
console.log(value.studPersonalDetails.lastName);
})
Using ng-repeat,you can do it like this.
<tr ng-repeat="oneArr in arr">
<td> {{oneArr.studPersonalDetails.name}}</td>
</tr>
Here is the plunker
You can see an angular ngRepeat example with your data here
First, create a controller with your data:
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.datalist = [
{
"studPersonalDetails":{
"id":0,
"name":"Digvijay",
"middleName":"",
"lastName":"Singh",
"fatherName":"Shyam Bahadur Singh",
"motherName":"ramawati Devi",
"dob":"5/7/1990 12:00:00 AM"
},
"clients":{
"clientID":1,
"clientName":null,
"clientDescriptions":null
},
"studentAddress":{
"address1":"12",
"address2":"12",
"city":"21",
"state":"212",
"pin":2
},
"courseDetails":{
"courseID":12,
"courseName":"12",
"courseDetail":null
},
"studentContacts":{
"email":"12",
"alternatePhone":"12",
"phone":"qw"
}
},
{
"studPersonalDetails":{
"id":0,
"name":"Anil",
"middleName":"kumar",
"lastName":"Sharma",
"fatherName":"bac",
"motherName":"bac",
"dob":"2/11/1989 12:00:00 AM"
},
"clients":{
"clientID":1,
"clientName":null,
"clientDescriptions":null
},
"studentAddress":{
"address1":"21",
"address2":"21",
"city":"5456",
"state":"8",
"pin":7
},
"courseDetails":{
"courseID":58,
"courseName":"58",
"courseDetail":null
},
"studentContacts":{
"email":"12",
"alternatePhone":"12",
"phone":"abc"
}
}
];
}
Then attach this controller to your view and use the ngRepeat to extract each top-level object from dataList array (during the itaration the current object has alias data)
Inside the repeat statement you can display requested values accessing the data object using dot notation:
<div ng-controller="MyCtrl">
<div class="row" ng-repeat="data in datalist">
<p><span>Name</span> {{ data.studPersonalDetails.name }}</p>
<p><span>CourseID</span> {{ data.courseDetails.courseID }}</p>
</div>
</div>