Question

所以，我在这个问题上遇到了同样的问题

Bootstrap-UI Typeahead display more than one property in results list?

并且，我已经修改了关于我的链接和需求

的答案

http://plnkr.co/edit/FdkvCUUD3ob7dt256Bgd?p=preview

然而，我意识到他们正在使用0.5版本的angular-ui和angular 1.0.5

在我的项目中，我使用角度1.4.9和anguilar-ui 1.3.3但不知何故，我的结果没有显示或显示为未定义

控制器

app.controller('testController', ['$scope', function ($scope) {
    $scope.sites = JSON.parse("[{\"SITE_CODE\":\"CODE1\",\"SITE_NAME\":\"NAME1\",\"ADDRESS\":\"\"},{\"SITE_CODE\":\"CODE2\",\"SITE_NAME\":\"NAME2\",\"ADDRESS\":\"\"},{\"SITE_CODE\":\"CODE3\",\"SITE_NAME\":\"NAME3\",\"ADDRESS\":\"\"},{\"SITE_CODE\":\"CODE4\",\"SITE_NAME\":\"NAME4\",\"ADDRESS\":\"\"}]");
}]);

HTML

<div class="row">
        <div class="col-xs-4">
            <div class="typeahead">
                <input type="text" class="form-control" ng-model="test" uib-typeahead="site as site.SITE_CODE for site in sites"
                       typeahead-no-results="noResults" typeahead-popup-template-url="siteList.html" />
            </div>
        </div>
    </div>
    <div class="row" ng-show="noResults">
        <div class="col-sm-6">
            <i class="glyphicon glyphicon-remove"></i> No Results Found
        </div>
    </div>
</div>
<script type="text/ng-template" id="siteList.html">
    <div class="row">
        <a tabindex="-1">
            <div class="col-xs-4">
                <span ng-bind-html-unsafe="match.model.SITE_CODE | typeaheadHighlight:query"></span>
            </div>
            <div class="col-xs-4">
                <span ng-bind-html-unsafe="match.model.SITE_NAME | typeaheadHighlight:query"></span>
            </div>
        </a>
    </div>
</script>

知道我错过了什么吗？

Answer 1

愚蠢的我，我刚刚发现了我的问题

我正在设置typeahead-popup-template-url而不是typeahead-template-url

进行此更改并将ngSanitize添加到我的模块后，一切都比预期的要好。

现在，我需要找出一种显示结果总数的方法，因为我只会显示结果数量的一小部分

Bootstrap -UI typeahead在结果列表中显示多个字段

1 个答案: