如何将 goog.ui.Autocomplete 最小输入设置为 0答案

【问题标题】：How to set goog.ui.Autocomplete minimum input to 0如何将 goog.ui.Autocomplete 最小输入设置为 0
【发布时间】：2014-01-31 15:26:07
【问题描述】：

我希望在输入框获得焦点时自动完成显示整个列表（没有给出输入）。还希望自动完成以匹配子字符串，而不必摆弄私有变量。

目前的代码是：

autocomplete = goog.ui.ac.createSimpleAutoComplete(
  gsa.Game.gameData.teams, team2, false);
matcher=autocomplete.getMatcher();
matcher.useSimilar_=true
autocomplete.setMatcher(matcher);

类似的匹配有效，但必须为此设置一个私有变量（没有可用的 getter 或 setter）。

另一个我没能找到；没有输入时如何显示所有数据（如智能选择输入）。因此，当文本框获得焦点时，它将显示所有数据，因为没有给出过滤器文本。这些是人们想要配置但在 API 文档中找不到的基本内容。

【问题讨论】：

标签： javascript google-closure-library

【解决方案1】：

您需要创建goog.ui.ac.AutoComplete、goog.ui.ac.ArrayMatcher 和goog.ui.ac.InputHandler 的后代。此外，您将直接创建自动完成对象的实例，而不是调用goog.ui.ac.createSimpleAutoComplete。

在goog.ui.ac.AutoComplete 后代中，您分配自定义输入处理程序和匹配器。

goog.provide('my.ui.ac.AutoComplete');

goog.require('goog.ui.ac.Renderer');
goog.require('my.ui.ac.ArrayMatcher');
goog.require('my.ui.ac.InputHandler');


my.ui.ac.AutoComplete = function(data, input, opt_multi, opt_useSimilar) {

    var renderer = new goog.ui.ac.Renderer();
    var matcher = new my.ui.ac.ArrayMatcher(data, !opt_useSimilar);
    var inputhandler = new my.ui.ac.InputHandler(null, null, !!opt_multi, 300);

    goog.ui.ac.AutoComplete.call(this, matcher, renderer, inputhandler);
    inputhandler.attachAutoComplete(this);
    inputhandler.attachInputs(input);
};
goog.inherits(my.ui.ac.AutoComplete, goog.ui.ac.AutoComplete);

在goog.ui.ac.ArrayMatcher 后代中，您需要覆盖getPrefixMatches() 方法，因为默认行为会丢弃空字符串。所以如果有一个空字符串，我们只返回数据的前 x 行。

goog.provide('my.ui.ac.ArrayMatcher');

goog.require('goog.ui.ac.ArrayMatcher');


my.ui.ac.ArrayMatcher = function(rows, opt_noSimilar) {
    goog.ui.ac.ArrayMatcher.call(this, rows, opt_noSimilar);
};
goog.inherits(my.ui.ac.ArrayMatcher, goog.ui.ac.ArrayMatcher);


my.ui.ac.ArrayMatcher.prototype.getPrefixMatches = function(token, maxMatches) {        
    if (token == '')
    {
        // for empty search string, return first maxMatches rows
        return this.rows_.slice(0, maxMatches);
    }
    else
    {
        return goog.base(this, 'getPrefixMatches', token, maxMatches);
    }
};

在goog.ui.ac.InputHandler 后代中，您需要覆盖processFocus() 方法，并强制显示自动完成弹出窗口。这可以通过调用update() 方法并将第一个参数设置为true 来完成。

goog.provide('my.ui.ac.InputHandler');

goog.require('goog.ui.ac.InputHandler');


my.ui.ac.InputHandler = function(opt_separators, opt_literals, opt_multi, opt_throttleTime) {
    goog.ui.ac.InputHandler.call(this, opt_separators, opt_literals, opt_multi, opt_throttleTime);
};
goog.inherits(my.ui.ac.InputHandler, goog.ui.ac.InputHandler);


my.ui.ac.InputHandler.prototype.processFocus = function(target) {
    goog.base(this, 'processFocus', target);

    // force the autocomplete popup to show
    this.update(true);
};

【讨论】：