オートコンプリートMaterializeCSSが流星で動作しない

Question

このAutocomplete MaterializeCSSのMaterializecssというオートコンプリートラベルを使用しました。しかし、流星ではうまくいかない。

Template.home.onRendered(function(){ 
 

 
if (Meteor.isClient) { 
 

 
     // your jQuery code here... 
 

 
    $('input.autocomplete').autocomplete({ 
 
    data: { 
 
     "Apple": null, 
 
     "Microsoft": null, 
 
     "Google": 'https://placehold.it/250x250' 
 
    }, 
 
    limit: 20, // The max amount of results that can be shown at once. Default: Infinity. 
 
    onAutocomplete: function(val) { 
 
     // Callback function when value is autcompleted. 
 
    }, 
 
    minLength: 1, // The minimum length of the input for the autocomplete to start. Default: 1. 
 

 
    }); 
 
}

<template name="searchbox"> 
 
    <br><br><br> 
 
    <div class="card" style="width: 600px;"> 
 
    
 
    {{#if currentUser}} 
 
     <form action="#"> 
 

 
     <div class="row"> 
 
      <div class="col s12"> 
 

 
      <div class="row"> 
 
       <div class="input-field col s12"> 
 
       <input type="text" id="autocomplete-input" class="autocomplete"> 
 
       <label for="autocomplete-input"> 
 
        Pesquisar... 
 
       </label> 
 
       </div> 
 
       <form action="#"> 
 
        <input class="with-gap" name="group1" type="radio" id="test1" checked/> 
 
        <label for="test1">Alunos</label> 
 
        <input class="with-gap" name="group1" type="radio" id="test2" /> 
 
        <label for="test2">disciplinas</label> 
 
       </form> 
 
      </div> 
 
      </div> 
 
     </div> 
 
     </form> 
 

 

 
    {{/if}} 
 

 
    </div> 
 

 
</template>

そして、ブラウザのコンソールに表示されるエラーは次のとおりです： 私のコードはここにある（それはMaterializeCSSからほぼ同じです）

Uncaught TypeError: this.source is not a function 
at $.(anonymous function).(anonymous function)._search (http://code.jquery.com/ui/1.10.2/jquery-ui.js:6987:8) 
at $.(anonymous function).(anonymous function)._search (http://code.jquery.com/ui/1.10.2/jquery-ui.js:401:25) 
at $.(anonymous function).(anonymous function).search (http://code.jquery.com/ui/1.10.2/jquery-ui.js:6979:15) 
at $.(anonymous function).(anonymous function).search (http://code.jquery.com/ui/1.10.2/jquery-ui.js:401:25) 
at $.(anonymous function).(anonymous function).<anonymous> (http://code.jquery.com/ui/1.10.2/jquery-ui.js:6960:10) 
at handlerProxy (http://code.jquery.com/ui/1.10.2/jquery-ui.js:730:6) 

Answer 1

// Initialize Auto Complete 
    // Need jQueryUI 
    $(document).ready(function() { 
     $('input.autocomplete').autocomplete({ 
      data: { 
       "Apple": null, 
       "Microsoft": null, 
       "Google": 'https://placehold.it/250x250' 
      }, 
      limit: 20, // The max amount of results that can be shown at once. Default: Infinity. 
      onAutocomplete: function (val) { 
       // Callback function when value is autcompleted. 
      }, 
      minLength: 1, // The minimum length of the input for the autocomplete to start. Default: 1. 
     }); 
    }); 

aotocomplete JSコードで囲む$(document).ready(function() {}) もインポートjQueryUI（jsとcss）