ua_*_*oaz 1 javascript twitter-bootstrap angularjs bootstrap-typeahead twitter-bootstrap-3
var app = angular.module('plunker', ['ui.bootstrap']);
app.controller('MainCtrl', function($scope) {
$scope.FDLAccountOther = [{
"fdlAccountId": 300,
"fdlAccountName": "IS00698000",
"fdlAccountDesc": "PT Rebates -To Trading Desks on selling concessions paid to IFG",
"fdlAccountType": "R",
"setId": "FDL01",
"isDefault": null,
"balanceForward": null,
"bsIndicator": null,
"status": "Active"
}, {
"fdlAccountId": 301,
"fdlAccountName": "IS00699000",
"fdlAccountDesc": "PT Rebates -To Trading Desks on selling concessions paid to IIG",
"fdlAccountType": "R",
"setId": "FDL01",
"isDefault": null,
"balanceForward": null,
"bsIndicator": null,
"status": "Active"
}]
});
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.js"></script>
<!DOCTYPE html>
<html ng-app="plunker">
<div class="input-group" ng-controller="MainCtrl">
<input type="text"
class="form-control"
ng-model="formData_TransGrid.fdlAcctNameOther"
placeholder="Enter FDL Account"
uib-typeahead="item.fdlAccountName as item.fdlAccountName for item in FDLAccountOther | filter:$viewValue|limitTo:3" />
<span class="input-group-btn">
<button class="btn btn-success ebtn"
type="button"
data-toggle="modal"
data-target="#FDLAccountLookUp">
Find FDL
</button>
</span>
</div>
</html>
Run Code Online (Sandbox Code Playgroud)
Run Code Online (Sandbox Code Playgroud)
实际上，还有更多的记录，但是预先输入的建议似乎没有用，有什么帮助吗？
更新资料
在typeahead指令前面添加uib已解决了该问题。谢谢您的帮助
更新资料
在typeahead指令前面添加uib已解决了该问题。谢谢您的帮助
您的预输入逻辑全部正常工作，但是您需要更新脚本模板中的一些内容才能使其正常工作：
- 就像您更新
typeahead到一样uib-typeahead，您需要更新typeaheadHighlight:query到uibTypeaheadHighlight:query
- 您需要使用
ng-bind-html属性而不是bind-html-unsafe
- 该脚本不了解
item您的typeahead配置，因此您需要使用match.model
结果是...
<script type="text/ng-template" id="/tpl.html">
<a><div>
<span style="display:block;" class="registration" ng-bind-html="match.model.fdlAccountName | uibTypeaheadHighlight:query"></span>
<span ng-bind-html="match.model.fdlAccountDesc | uibTypeaheadHighlight:query"></span> ·
<span ng-bind-html="match.model.status | uibTypeaheadHighlight:query"></span>
</div></a>
</script>
Run Code Online (Sandbox Code Playgroud)
这是完整的代码段：
<script type="text/ng-template" id="/tpl.html">
<a><div>
<span style="display:block;" class="registration" ng-bind-html="match.model.fdlAccountName | uibTypeaheadHighlight:query"></span>
<span ng-bind-html="match.model.fdlAccountDesc | uibTypeaheadHighlight:query"></span> ·
<span ng-bind-html="match.model.status | uibTypeaheadHighlight:query"></span>
</div></a>
</script>
Run Code Online (Sandbox Code Playgroud)
var app = angular.module('plunker', ['ui.bootstrap']);
app.controller('MainCtrl', function($scope) {
$scope.FDLAccountOther = [{
"fdlAccountId": 300,
"fdlAccountName": "IS00698000",
"fdlAccountDesc": "PT Rebates -To Trading Desks on selling concessions paid to IFG",
"fdlAccountType": "R",
"setId": "FDL01",
"isDefault": null,
"balanceForward": null,
"bsIndicator": null,
"status": "Active"
}, {
"fdlAccountId": 301,
"fdlAccountName": "IS00699000",
"fdlAccountDesc": "PT Rebates -To Trading Desks on selling concessions paid to IIG",
"fdlAccountType": "R",
"setId": "FDL01",
"isDefault": null,
"balanceForward": null,
"bsIndicator": null,
"status": "Active"
}]
});
Run Code Online (Sandbox Code Playgroud)