javascript - 仅接受使用 materialize 列出的选项的自动完成

Question

因为我无法在 Select 小部件中输入文本，所以我使用了 Autocomplete Input 小部件。我的问题是如何只接受自动完成列表建议的选项？

HTML

 <div class="row">
    <div class="col s12">
      <div class="row">
        <div class="input-field col s12">
          <i class="material-icons prefix">textsms</i>
          <input type="text" id="SimpleInput" class="autocomplete validate" required>
          <label for="SimpleInput">AutocompleteSimple</label>
        </div>
      </div>
    </div>
  </div>
</div> <!-- CLOSE CONTAINER -->

Javascript

var instances = M.Autocomplete.init(elems, 
  {data: 
     {"Apple": null,
    "Microsoft": null,
    "Google": null},
    minLength: 0});

期待

我希望这个自动完成小部件只接受选项中的输入，如果可行的话，可能会添加额外的自制输入选项。在其他情况下，小部件应该是红色的，就像没有添加输入的情况一样。换句话说，这些输入应该被认为是无效的。

实际结果 它接受所有类型的输入。

我使用的代码也可以在CodePen中看到

标签： javascriptautocompletematerializetypescript