...

<ws-search-result>
    <div class="result-item 810610"></div>
    <div class="result-item 810687"></div>
    <div class="result-item 580065"></div>
    <div class="result-item 810608"></div>
    <div class="result-item 810576"></div>
</ws-search-result>

Die Anzeige der Produkte muss nicht zwingend über die innerhalb des <template>-Tags definierten Platzhalter erfolgen. Alternativ können Sie die Produktboxen der WebComponents durch die WEBSALE Produktbox ersetzen. Dies geschieht durch die Integration einer eindeutigen ID im <template>-Tag.

<template id="resultItemTemplate">
    <div id="wsProductWebComponent-{{record.ProdIndex}}" class="result-item {{record.ProdIndex}}">
        ...
    </div>
</template>

Die ID wsProductWebComponent-{{record.ProdIndex}} ermöglicht es, an dieser Stelle per AJAX die Inhalte der WEBSALE Produktbox nachzuladen. Dadurch kann die Ausgabe der Produkte um alle Shop-Funktionen ergänzt werden, die über die WEBSALE Produktbox bereitgestellt werden.

Debugging und Ausgabe in der Konsole

Um die JSON-Daten Anzeige der Ergebnisse mit dem technischen Response zu überprüfen, können Sie das folgende Skript verwenden. Es gibt die Ergebnisse in der Browser-Konsole aus:

...