CODEWITHSUNDEEP
jsonajaxaccelerated-mobile-pagegoogle-amp
mkoala
mkoala

Reputation: 963

Show contents from JSON called via AJAX in AMP

I'm trying to implement an AMP-Version of a site which is calling a 3rd-Party rest endpoint. The Endpoint provides JSON-Data and a part of that data should be shown on the Website.

I already tried amp-list, which is no help for me because that called JSON is not an Array. Also amp-bind is not helping because I dont want to change the contents after a button has been clicked, it should be there initially.

Small Example Code to help with the understanding of my question:

The JSON delivered by the 3rd Party API looks like

a: {
  aHead:'aHead',
  aBody:'aBody'
},
b: {
  bHead:'bHead',
  bBody:'bBody'  
}

And then I would like to acces the values of that JSON Object in my .html similar like in this pseudo code example

<h2>{{a.aHead}}</h2>
<p>{{a.aBody}}</p>

<h2>{{b.bHead}}</h2>
<p>{{b.bBody}}</p>

Upvotes: 0

Views: 1613

Answers (1)

Sebastian Benz
Sebastian Benz

Reputation: 4288

amp-list is the correct approach here. The content will be rendered on page load. There is no user-input required.

Your best bet is to proxy the 3P endpoint and restructure the JSON result. This has an additional advantage: you can add the CORS headers required by the AMP runtime.

Upvotes: 1

Related Questions