Angularjs 不带选项的Angular UI Typeahead筛选器删除

我想知道是否有一种方法可以在书写时“突出显示”Angular Typeahead中的最佳选择（就像过滤器一样），但不删除所有其他选项：

uib-typeahead="item.prop as item.prop for item in vm.items | filter: $viewValue"

vm.items

只是一个简单的静态数组，没有异步/远程搜索

---

谢谢大家!

有一个是angular ui库的一部分。它具有您所需的功能。

我使用此指令回答自己的问题，该指令嵌入了Typeahead指令，并模仿了组合框/选择的功能：

js:

.directive（'combobox'，['$compile'，'$timeout'，函数（$compile，$timeout）{
var指令={
限制：'E'，
范围：{
型号：“=”，
项目：“@”，
项目：“=i”，
onSelect:“&”，
onBlur:“&”
},
编译：编译
};
返回指令；
函数编译（元素、属性）{
返回函数（范围、元素、属性）{
scope.focusing=false；
scope.first=null；
scope.open=函数（）{
var ctrl=element.find（'input'）.controller（'ngModel'）；
var temp=范围模型；
ctrl.$setViewValue（“”）；
$timeout（函数（）{
ctrl.$setViewValue（“”）；
scope.model=温度；
});
};
scope.select=功能（项目、型号、标签）{
scope.focusing=true；
onSelect（{item:item，model:model，label:label}）；
};
scope.blur=函数（）{
scope.focusing=false；
onBlur（）；
};
scope.focus=函数（）{
if（scope.focusing==false）{
scope.focusing=true；
元素。查找（'input'）[0]。焦点（）；
scope.first=scope.model；
scope.open（）；
}
};
scope.keyup=功能（键）{
如果（键===27）{
scope.model=scope.first；
scope.open（）；
}
};
变量模板=“”+
'    ' +
'    ' +
“{model | |”'+attrs.placeholder+''}”+
'        ' +
'    ' +
'';
html（模板）；
element.removeClass（attrs.class）；
$compile（element.contents（））（范围）；
};
}
}]);

这是我的建议：

希望它能帮助别人

.directive('combobox', ['$compile', '$timeout', function($compile, $timeout) {
var directive = {
    restrict: 'E',
    scope: {
        model: "=",
        item: "@",
        items: "=i",
        onSelect: "&",
        onBlur: "&"
    },
    compile: compile
};

return directive;

function compile(element, attrs) {
    return function(scope, element, attrs) {
        scope.focusing = false;
        scope.first = null;

        scope.open = function() {
            var ctrl = element.find('input').controller('ngModel');

            var temp = scope.model;

            ctrl.$setViewValue(' ');

            $timeout(function() {
                ctrl.$setViewValue('');
                scope.model = temp;
            });
        };

        scope.select = function(item, model, label) {
            scope.focusing = true;
            scope.onSelect({item: item, model: model, label: label});
        };

        scope.blur = function() {
            scope.focusing = false;
            scope.onBlur();
        };

        scope.focus = function() {
            if (scope.focusing === false) {
                scope.focusing = true;
                element.find('input')[0].focus();
                scope.first = scope.model;
                scope.open();
            }
        };

        scope.keyup = function(key) {
            if (key === 27) {
                scope.model = scope.first;
                scope.open();
            }
        };

        var template = '<div class="combo combo-static">' +
                       '    <input ng-model="model"' +
                       '           uib-typeahead="' + attrs.item + '"' +
                       '           typeahead-focus-first="false"' +
                       '           typeahead-min-length="0"' +
                       '           typeahead-editable="false"' +
                       '           typeahead-on-select="select($item, $model, $label)"' +
                       '           ng-focus="focus()"' +
                       '           ng-blur="blur()"' +
                       '           ng-keyup="keyup($event.keyCode)"' +
                       '           placeholder="' + attrs.placeholder + '"' +
                       '           type="text"' +
                       '           class="' + attrs.class + '">' +
                       '    <div class="combo-label" ng-click="focus()" ng-hide="focusing">' +
                       '        <span>{{model || "' + attrs.placeholder + '"}}</span>' +
                       '        <i class="fa fa-caret-down"></i>' +
                       '    </div>' +
                       '</div>';

        element.html(template);
        element.removeClass(attrs.class);

        $compile(element.contents())(scope);
    };
}
}]);