建議在文本框中可能嗎？

Question

我有型文本輸入框：

<input type="text></input> 

我有名字的列表：

$scope.employees = [{ 
    name: "vishnu" 
}, { 
    name: "seenu" 
}]; 

現在讓它成爲唯一2 當我鍵入v，它應該顯示vishnu爲建議。當我輸入se, it should show seenu`作爲建議。這怎麼能實現？

Answer 1

填充選項與$scope.employees值與data-ng-repeat：

var app = angular.module('myApp', []); 
 
app.controller('myController', function($scope, $http) { 
 
    $scope.employees = [{ 
 
     name: "vishnu" 
 
    }, 
 
    { 
 
     name: "seenu" 
 
    }]; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myController"> 
 
    <input type="text" list="names" placeholder="Pick a name.."> 
 
    <datalist id="names"> 
 
    <option data-ng-repeat="item in employees" value="{{item.name}}"> 
 
    </datalist> 
 
</div>

祝你好運！

Answer 2

有與jQuery自動完成下面給出簡單的例子

$scope.complete=function(){ 
    $("#tags").autocomplete({ 
     source: $scope.availableTags 
    }); 
    } 
    }); 

http://plnkr.co/edit/5XmPfQ78vRjSrxE0Tt3B?p=preview

的 datalist

Answer 3

var app = angular.module('myApp', []); 
 
app.controller('myController', function($scope, $http) { 
 
    $scope.employees = [{ 
 
     name: "vishnu" 
 
    }, 
 
    { 
 
     name: "seenu" 
 
    }]; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myController"> 
 
    <input type="text" list="names" placeholder="Pick a name.."> 
 
    <datalist id="names"> 
 
    <option data-ng-repeat="item in employees" value="{{item.name}}"> 
 
    </datalist> 
 
</div>