[英]angular-ui bootstrap typeahead limit is not working
我是angularjs的新手。 從這個網站https://angular-ui.github.io/bootstrap/我得到了我的angularjs項目的typeahead指令，但我的限制和過濾器在這里不起作用是我的代碼。
當我在文本字段中鍵入“c”時，我只想顯示8條記錄，而是顯示所有記錄。
plunker http://plnkr.co/edit/RhwHmKwSxWBh3rp0u85O?p=preview
angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('TypeaheadCtrl', function($scope, $http) {
$scope.getLocation = function(val) {
return $http.get('http://maps.googleapis.com/maps/api/geocode/json', {
params: {
address: val,
sensor: false
}
}).then(function(response){
return response.data.results.map(function(item){
return item.formatted_address;
});
});
};
});
<!doctype html>
<html ng-app="ui.bootstrap.demo">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<script type="text/ng-template" id="customTemplate.html">
<a>
<img ng-src="http://upload.wikimedia.org/wikipedia/commons/thumb/{{match.model.flag}}" width="16">
<span bind-html-unsafe="match.label | typeaheadHighlight:query"></span>
</a>
</script>
<div class='container-fluid' ng-controller="TypeaheadCtrl">
<h4>Asynchronous results</h4>
<pre>Model: {{asyncSelected | json}}</pre>
<input type="text" ng-model="asyncSelected" placeholder="Locations loaded via $http" typeahead="address for address in getLocation($viewValue) | filter:$viewValue |limitTo:8" typeahead-loading="loadingLocations" class="form-control">
<i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
</div>
</body>
</html>
我知道這是一個老問題，但我會繼續回答它，以備將來參考：
這是通過$ http加載時的已知行為，因為在調用get方法時，限制將應用於promise，這將導致它在您的promise解析時不應用於實際結果集。
有關詳細信息，請參閱ui.bootstrap存儲庫中的問題＃1740 。
解決此問題的方法是滾動您自己的過濾器函數並從該過濾器返回承諾，而不是直接獲取記錄或在API中實現限制參數並限制它在服務器端。
angular.js ui + bootstrap typeahead +異步調用
[英]angular.js ui + bootstrap typeahead + asynchronous call
Twitter Bootstrap 2.3.2 Typeahead的問題不起作用
[英]Issues with twitter bootstrap 2.3.2 typeahead not working
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.