Javascript 需要帮助创建一个执行TypeAhead功能的指令吗 出身背景

如果您熟悉Evernote桌面应用程序，在向便笺添加标记时，您可以开始键入标记的名称。一旦开始键入，“帮助文本”将出现，以帮助您选择正确的标记。所以它起到过滤器的作用。对于我的web应用程序，我需要一个功能与此类似的控件

到目前为止我所拥有的 在我的

controllers.js

文件中，我为临时测试定义了以下属性。一旦我使用测试数据获得该属性，该属性将使用API中的数据填充

$scope.data.types={types:[{name:'Developer'}，{name:'Developer Company\'}，{name:'accountary'}，{name:'Legal council\'}]}

在我的路线模板文件
contacts edit.html
中，我有以下一段相关代码。基本上，我有一个可编辑的
，它从
$scope.data.contacts
中拉入并显示持久性标记（即为该联系人保存在数据库中的标记）

<div class="form-group">
    <label for="entity_types" class="control-label col-sm-2">Tags</label>
    <div class="col-sm-5">
        <div class="form-control" contenteditable="true" ng-model="data.contact.EntityTypes" my-Directive my-Other-Directive></div>
    </div>
</div>

因此，我能够在
获得焦点时立即显示帮助块（顺便说一句，它在
模糊时被删除）。我无法让数据绑定在
data.types.types
上工作，我不知下一步该怎么办。任何帮助都将不胜感激。
如果您试图让autocomplete为输入框工作，我将使用当您将
类型
参数传递到指令中时，它将使其具有独立的作用域。这意味着您将无法访问指令中的
$scope.data
表单。要解决此问题，您还可以传入
数据

scope: {
    type: '='
    data: '='
}

我查看了TypeAhead功能，这与我正在寻找的功能非常接近。但是，当您在文本框中输入多个单词/标记时，前面的键入将不起作用。此外，如果textbox/div中当前有值，则可能不起作用。
scope: {
    type: '='
    data: '='
}