AngularJS Access to JSON Nested Object Fails

Question

I have a JSON Object graph that looks like this (note there is only 1 array in the object called lineItems:

{
  "salesOrderUid": 52,
  "orderNumber": "1428002206349",
  "billToCity": "Golden",
  "billToFirstName": "Duke",
  "billToLastName": "Developer",
  "shipToStreetNumber": "12345",
  "shipToUnitNumber": null,
  "shipToZipCode": 80401,
  "promoCode": "Test",
  "lineItems": [
    {
      "salesOrderLineUid": 59,
      "salesOrderUid": 52,
      "extendedPrice": 50,
      "itemQuantity": 10,
      "itemPrice": 5,
      "catalogItem": {
        "catalogItemUid": 1,
        "itemPrice": 5,
        "catalog": {
          "catalogUid": 1,
          "validFrom": 1420095600000,
          "validThrough": 1435644000000
        },
        "item": {
          "itemUid": 1,
          "productCategoryUid": 1,
          "productDescription": "Product used for testing",
          "productName": "Test"
        }
      },
      "shipmentUid": null
    }
  ]
}

I iterate over lineItems like so:

<tr ng-repeat="salesOrderLineItem in salesOrder.lineItems">
  <td>{{salesOrderLineItem.catalogItem.catalog.productName}}</td>
  <td>{{salesOrderLineItem.itemQuantity}}</td>
  <td>{{salesOrderLineItem.itemPrice | currency}}</td>
  <td>{{salesOrderLineItem.extendedPrice | currency}}</td>
</tr>

The "first level" properties are displayed just fine. (itemQuantity, itemPrice and extendedPrice) But nothing gets displayed for the nested property called catalogItem.catalog.productName.

The JSON object reflected above came directly out of the Developer Tools console so it's clear that the contents are there. And the catalogItem property is not an array so I should be able to chain object property references, shouldn't I?

I've seen many questions posted related to accessing nested JSON but they seem to all have nested arrays in the JSON...which is not the case here.

Thanks in advance

Tom Arad · Accepted Answer · 2015-05-05 20:34:40Z

1

catalog does not contain a field called productName. Did you mean to use item instead of catalog?

answered May 5, 2015 at 20:34

Tom Arad

2512 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Patty Eilers Over a year ago

Yes, I did intend to use "item" instead of "catalogItem"...thought I had tried that without success. Apologies for submitting such a "simple" question. As always, appreciate the responses!

kevinawalker · Accepted Answer · 2015-05-05 20:36:04Z

1

Looks to me that 'productName' is nested under 'item', not 'catalog'.

Change the line to be

<td>{{salesOrderLineItem.catalogItem.item.productName}}</td>

And that should be what you are looking for?

answered May 5, 2015 at 20:36

kevinawalker

5495 silver badges12 bronze badges

Collectives™ on Stack Overflow

AngularJS Access to JSON Nested Object Fails

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related