Question

我想在我的角项目中使用自动填充输入文本框功能。

所以我尝试在输入文本框中使用typeahead指令。

这里是模块防御：

(function () {
    "use strict";
    angular.module("damageEvent", ["ui.router",
        "geomindCommon",
        "lookups",
        "ngAnimate",
        "ui.bootstrap"])

        .config([
            "$stateProvider",
            function ($stateProvider) {

                $stateProvider
                  .state("sitesDamages", {
                      abstract: true,
                      url: "/sitesDamages",
                      template: "<ui-view></ui-view>"

                  })
                  .state("sitesDamages.sitesList", {
                      url: "/",
                      templateUrl: "app/damageEvent/templates/sitesDamageEvents.tmpl.html",
                      controller: "sitesDamageEventsController",
                      controllerAs: "list",
                  })
            }
        ]);
})();

这是控制器防御：

(function () {
    "use strict";

    angular.module('damageEvent').controller("sitesDamageEventsController", [ sitesDamageEventsController]);


    function sitesDamageEventsController() {
        var self = this;

        self.selected = '';
        self.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas',
                        'California', 'Colorado', 'Connecticut', 'Delaware',
                        'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois',
                        'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
                        'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
                        'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada',
                        'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota',
                        'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
                        'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia',
                        'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];

    }
})();

这是HTML模板：

<div class="container">

        <input type="text"
               typeahead-min-length="0"
               ng-model="list.selected"
               typeahead="state for state in list.states | filter:$viewValue:emptyOrMatch | limitTo:8"
               class="form-control">

    </div>

以下是视图中的内容：

当我专注于输入文本框并在其中开始打印时，自动完成列表会弹出。

但是当点击（聚焦）输入文本框时，我需要弹出自动填充列表。

我使用的是ui-bootstrap版本：0.14.2和angularjs版本1.4.7。

任何想法是否可以在文本框聚焦时制作弹出自动完成列表？

Answer 1

尝试使用typeahead-min-length =“0”，这个PR应该允许这种行为。

<强> 修改此功能在1.1.0版本中提供。

单击文本框时打开自动完成列表

1 个答案: