Angularjs 如何使自动完成就像谷歌自动建议在角度用户界面选择

我正在使用angular ui select进行自动完成。当用户开始键入时，我想将最匹配的项目显示为带水印的项目，当用户按tab键时，它应该被选中（与google auto suggest相同）

请看图片也。您可以看到，当我键入“自动”“完成”显示为水印时，如果我按下选项卡，它将被选中

---

使用angular ui select library…它将进行REST调用以从后端系统获取数据，用于自动完成下拉列表…和水印…您可以通过CSS更改它。 对于库，请查找URL:

有一个bower插件，您可以创建一个angular指令来在应用程序中呈现自动完成输入

指令.js

angular.module('app').directive('autoComplete', [
  '$timeout', function($timeout) {
    return function(scope, element, attrs) {
      var auto;
      auto = function() {
        $timeout((function() {
          if (!scope[attrs.uiItems]) {
            auto();
          } else {
            element.autocomplete({
              source: [scope[attrs.uiItems]]
            });
          }
        }), 5);
      };
      return auto();
    };
  }
]);

HTML使用示例

<input type="text" auto-complete ui-items="list" ng-model="yourModel" class="form-control" placeholder="Tipe something" />

---

变量列表包含自动完成输入中可能结果的数组，在名为ui项的属性中设置。

在ui选择中，如果键入内容，它将在自动完成下拉列表中突出显示。然而，我找不到这样一个例子，它甚至在选择之前就在文本字段中显示最匹配的项目，并且使用您的答案将其显示为带水印的项目对我不起作用。我的模型变量仅更新为键入的部分子字符串，而不是完全选定的匹配项。。。有没有办法解决这个问题？看到这里的问题了吗