Javascript typeahead.js不'；t使用远程数据显示下拉列表

我想我已经有5个小时没有使用typeahead.js库了。我正在尝试使用远程功能加载数据，但我没有任何运气让它完全工作

以下是我正在加载的js库：

<script src="/Scripts/jquery-2.1.4.js"></script>
<script src="/Scripts/handlebars-v3.0.3.js"></script>
<script src="/Scripts/typeahead.bundle.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>

通过调试步骤，我意识到远程数据检索工作正常，因为：

a） 在firefox/firebug中，我看到了请求和响应

b） 我在

filter

分配的函数中放入了

console.log

语句，一切正常

。。。一切都到此为止。。。没有任何内容显示为下拉列表，提示也不起作用

接下来我做的是在

typeahead:render

和

typeahead:asyncreceive

事件上放置一些

console.log

语句，我看到的是所有参数（除了jquery事件）都是

未定义的

，这让我相信，不知何故，typeahead没有正确初始化

如果你有任何想法或建议，请给我一个提示

谢谢大家!

稍后编辑：生成的HTML如下所示：

<div class="col-sm-3 col-md-3 pull-right">
<form action="/Home/Search" class="navbar-form" method="get" role="search">
<div class="input-group">
  <input class="form-control typeahead" id="query" name="query" placeholder="Search" type="text" value="" />
    <div class="input-group-btn">
      <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
    </div>
</div>
</form>                

---

这没有任何用处，因为我还没有达到展示某些东西的程度。。。我看到问题中的数据也是本地的…这背后的HTML是什么？我也用HTML更新了问题。非常感谢。你能在上面创建一个演示吗？

<div class="col-sm-3 col-md-3 pull-right">
<form action="/Home/Search" class="navbar-form" method="get" role="search">
<div class="input-group">
  <input class="form-control typeahead" id="query" name="query" placeholder="Search" type="text" value="" />
    <div class="input-group-btn">
      <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
    </div>
</div>
</form>