Algolia’s InstantSearch.js is working really great. (not on mine)
However, I created a custom API which has some restaurant information in it.
I’d like to understand why I don’t get the result displayed of the API on the dropdown.
I followed step by step and the api data are correct.
What am I missing here?
https://codesandbox.io/s/compassionate-goodall-39hhj?file=/src/app.js
/* global instantsearch algoliasearch */
const search = instantsearch({
indexName: 'demo_ecommerce',
searchClient: algoliasearch('XYTOW5OR7C', 'f446bfff654badd2f52e813e44e52518'),
});
search.addWidgets([
instantsearch.widgets.searchBox({
container: '#searchbox',
}),
instantsearch.widgets.hits({
container: '#hits',
templates: {
item: `
<div>
<img src="{{foodimage}}" align="left" alt="{{restaurantname}}" />
<img src="{{restaurantlogo}}" align="left" alt="{{restaurantname}}" />
<div class="hit-name">
{{restaurantname}}{ "attribute": "restaurantname" }{{restaurantname}}
</div>
<div class="hit-description">
{{restauranttype}}{ "attribute": "restauranttype" }{{restauranttype}}
</div>
<div class="hit-rate">${{rate}}</div>
<div class="hit-review">${{review}}</div>
<div class="hit-offer">${{offer}}</div>
<div class="hit-delivery">${{delivery}}</div>
<div class="hit-location">${{location}}</div>
</div>
`,
},
}),
]);
search.start();