Algolia Vorlage, wenn keine Treffer zurückgegeben werden

Question

Ich habe mein eigenes Algolia PoC basierend auf https://www.algolia.com/doc/search/auto-complete implementiert und ich kämpfe jetzt mit einem bestimmten Anwendungsfall: Wie kann ich mit einer Suche umgehen, die keine Treffer zurückgibt?

Hier ist mein Code:

Ich habe in der Lage zu erkennen und zu erkennen, wann/wo keine Treffer zurückgegeben werden, aber ich kann nichts tun, außer nur console.log() verwenden. Ich habe versucht, eine benutzerdefinierte return_msg zu bekommen, aber ich kann die Funktion nicht aufrufen. Ich habe auch versucht, etwas zu tun unter Vorschlag: Funktion (Vorschlag), aber diese Funktion wird nie aufgerufen, wenn keine Treffer zurückgegeben werden. Ich habe auch keine Dokumentation zu diesem „Templates“ auf https://github.com/algolia/autocomplete.js

$('#q').autocomplete({ hint: false }, [ 
    { 
     source: function(q, cb) { 
     index.search(q, 
      { hitsPerPage: 10 }, 
      function(error, content) { 
        if (error) { 
        cb([]); 
        return; 
        } 

        if (content.nbHits == 0) 
        { return_msg = '<h5> Sorry, no result </h5>'; 
         // DO something here 
         console.log(return_msg); 
        // console.log return "Sorry, no result" 
        } 

        cb(content.hits, content); 

       }); 
      }, 
     displayKey: 'game', 
     templates: { 
     suggestion: function(suggestion) { 
      return_msg = '<h5> '+ suggestion.MY_ATTRIBUTE + '</h5>' 
     return return_msg; 
     } 
     } 
    } 
    ]).on('autocomplete:selected', function(event, suggestion, dataset) { 
    window.location = (suggestion.url); 
    }); 

gefunden Alle Hinweise würden sehr geschätzt =)

Answer 1

Mit der templates Option Ihres Datensatzes können Sie die Vorlage angeben zu verwenden, wenn Es gibt keine Ergebnisse:

source: autocomplete.sources.hits(indexObj, { hitsPerPage: 2 }), 
templates: { 
    suggestion: // ... 
    header: // ... 
    footer: // ... 
    empty: function(options) { 
    return '<div>My empty message</div>'; 
    } 
} 

Vollständige Dokumentation here.