In this guide, you will learn how to evaluate JSON data using the LG Editor within Zammo UI Builder.

The following topics are covered:

• Working with JSON data from an API
• Using jPath to extract data from JSON
• Extracting Data From A Child Object
• Using the expression editor, preview, and test data panes within the LG Editor

You will learn how to use the LG Editor to quickly evaluate JSON data, test an expression in the LG Editor, and view how it will be rendered to the end-user.

Fictitious Web API Customer Data

We’ll be using data from a fictitious web API that returns a customer record. For reference, a sample payload from this API will be in the following format:

{
    "statusCode": 200,
    "reasonPhrase": "OK",
    "headers": {
        "server": "abc",
        "date": "Sun, 21 Aug 2022 15:28:30 GMT",
        "content-type": "application/json;charset=UTF-8",
        "transfer-encoding": "chunked",
        "connection": "close",
        "x-is-logged-in": "true",
        "x-transaction-id": "abcdefghig",
        "x-total-count": "0",
        "pragma": "no-store,no-cache",
        "cache-control": "no-cache,no-store,must-revalidate,max-age=-1",
        "expires": "0",
        "strict-transport-security": "max-age=63072000; includeSubDomains"
    },
    "content": {
        "result":[
						{
					    "firstName": "John",
					    "lastName": "doe",
					    "age": 26,
					    "address": {
						        "streetAddress": "naist street",
							       "city": "Nara",
							        "postalCode": "630-0192"
						   },
					    "phoneNumbers": [
				       {
				            "type": "iPhone",
				            "number": "0123-4567-8888"
				       },
				       {
				            "type": "home",
				            "number": "0123-4567-8910"
				       }
						 ]
					 }
}
  

We’ll use the LG Editor to extract some of the values from this JSON.

Extracting The Username

Here we’ll extract the user name from the JSON. To do this perform the following steps: