I'm working on integrating Algolia's InstantSearch.js into my project. Since the search results will contain a lot of HTML, I want to organize it in a Hogan template. The search results seem to be loading, but nothing is being displayed on the screen?
<script type="text/template" id="hit-template">
{{#hits}}
<div class="hit">
<div class="hit-image">
<p>test: {{ objectID }}</p>
</div>
</div>
{{/hits}}
</script>
<script>
var hitTemplate = Hogan.compile($('#hit-template').text());
search.addWidget(
instantsearch.widgets.hits({
container: '#hits-container',
templates: {
empty: 'No results',
item: function(data){
return hitTemplate.render(data);
}
},
hitsPerPage: 6
})
);
</script>
Any assistance with this issue would be greatly appreciated.