Entonces, básicamente, lo que estoy tratando de hacer es hacer que mi para cada función para la base de datos de firebase agregue una nueva línea a una variable json, y lo hace con éxito, pero cuando intento iniciar el cuadro de autocompletar con esos datos, no funciona, es solo un cuadro de escritura normal, registré mi variable json y sale correctamente, pero no se inicia correctamente Aquí está todo mi código:

índice.html

 <div class="input-field col s12"> <i class="material-icons prefix">person</i> <input type="text" id="autocomplete-input" class="autocomplete"> <label for="autocomplete-input">Autocomplete Test</label> </div>

índice.js

 var autocompletejson const database = firebase.database() database.ref('FLSocial/Accounts/') .once('value', function (snapshot) { // <-- consider Promise API instead const sortedChildren = []; snapshot.forEach(childSnapshot => { sortedChildren.unshift(childSnapshot) }); // reverses the order sortedChildren.forEach(childSnapshot => { const childKey = childSnapshot.key; const childData = childSnapshot.val(); /* rest of the code */ autocompletejson += ` "${childKey}": null,`; }) setTimeout(test_autofill, 3000) //3 Seconds Later it runs the function grabbing the global variable and trying to init the auto complete with the data }); function test_autofill() { console.log(autocompletejson) $('input.autocomplete').autocomplete({ data: {autocompletejson}, }); }

Ejemplo que dieron en el sitio web de MaterializeCSS:

 $(document).ready(function(){ $('input.autocomplete').autocomplete({ data: { "Apple": null, "Microsoft": null, "Google": 'https://placehold.it/250x250' }, }); });