AngularJS选择与自动完成功能

Question

任何人都可以请告诉我如何创建一个可编辑的搜索框，（不自动完成），因为在自动完成时，只有当我们键入选择出现，但在这种情况下，当我们没有输入任何所有选项将显示为下拉菜单，以及当我们输入任何显示的选项时，应该根据该选项进行过滤

应该像自动完成一样运行以及像select一样。

谁能告诉我，这

Working Demo

HTML一些解决方案

<select ng-model="names" ng-options="person.name for person in persons | orderBy:'name'" ng-change="select()"> 
</select> 

脚本

var app = angular.module('myApp', []); 

app.controller('Controller', function ($scope) { 
    $scope.persons = [{ 
     "uid": 1171, 
      "name": "Mary", 
      "description": "Mary" 
    }, { 
     "uid": 1172, 
      "name": "John", 
      "description": "John" 
    }, { 
     "uid": 1173, 
      "name": "Sunny", 
      "description": "Sunny" 
    }, { 
     "uid": 1174, 
      "name": "Jacob", 
      "description": "Jacob" 
    }, { 
     "uid": 1175, 
      "name": "Susan", 
      "description": "Susan" 
    }, { 
     "uid": 1176, 
      "name": "Supriya", 
      "description": "Supriya" 
    }, { 
     "uid": 1177, 
      "name": "Sumaya", 
      "description": "Sumaya" 
    }]; 
}); 

Answer 1

听起来像ui-select。

演示here - 请参阅上一个选择框。

例如：

<ui-select ng-model="country.selected" theme="selectize" ng-disabled="disabled" style="width: 300px;"> 
    <ui-select-match placeholder="Select or search a country in the list...">{{$select.selected.name}}</ui-select-match> 
    <ui-select-choices repeat="country in countries | filter: $select.search"> 
    <span ng-bind-html="country.name | highlight: $select.search"></span> 
    <small ng-bind-html="country.code | highlight: $select.search"></small> 
    </ui-select-choices> 
</ui-select>