var $myinput = $('#myinput');
$myinput.data('typeahead')._showDropdown()
$(".typeahead").eq(0).trigger("keyup");
typeaheadText 和 typeaheadTrigger 变量，以便在按钮触发时（通过将触发器设置为 true）填充 disbled 字段。该指令具有隔离作用域，因此它不依赖于传递的任何其他内容。directive('typeaheadTrigger', function() {
return {
require: ["ngModel"],
scope: {
typeaheadText: '=',
triggerFlag: '='
},
link: function(scope, element, attr, ctrls) {
scope.$watch('triggerFlag', function(value) {
if (scope.triggerFlag) {
ctrls[0].$setViewValue(scope.typeaheadText);
scope.typeaheadText = '';
scope.triggerFlag = false;
}
});
}
};
})
对于那些想手动触发类型自动完成行为（例如在按钮点击上）的人，我强烈建议不要这样做。
我曾为此解决方案而努力了一整天，几乎失去了全部时间（在我的情况下是一个按钮点击事件）。
对于那些真的想走这条“黑暗之路”的人，我会与你们分享我的丑陋代码，让它正常工作：
//Removes default features of typeahead
//This means that typeahead will not work like an "autocomplete", it only will be trigged when the user Click in #btnSearch button!
var txt = $("#typeahead");
//Save input events in variables (we'll need them)
eventInput = $._data(txt[0], "events").input[0];
eventBlur = $._data(txt[0], "events").blur[1];
//Remove input events
txt.unbind("blur");
txt.unbind("input");
//Set click event that triggers typeahead features manually
$("#btnSearch").click(function () {
//Clears the cache of engine for it call ajax again, without it when the term was already searched the ajax is not called!
engine.clearRemoteCache();
txt.focus(); //When we click in a button, the focus from input is lost, so we set it again to not lose the behaviors of keyboard keys (up, down, tab, etc)
txt.bind("input", eventInput); //Bind the event that we had saved
txt.trigger("input"); //Trigger input (like the answer from @epascarello)
txt.unbind("input"); //Removes it again
});
//Set event on parent of the suggestion's div, this makes the sugestion div close when user click outside it
$("body").click(function () {
if (eventBlur != undefined) {
if ($(".tt-dropdown-menu:visible").length > 0) {
eventBlur.handler(); //This event closes the suggestion menu
}
}
});
我所做的另一件事是更改typeahead.js事件"_checkInputValue"的代码。我更改了以下内容：
areEquivalent = areQueriesEquivalent(inputValue, this.query);
转换为：
areEquivalent = false;//areQueriesEquivalent(inputValue, this.query);
$( document ).ready(function() {
$('#the-basics .typeahead').typeahead({
hint: false,
highlight: true,
minLength: 0
},
{
name: 'states',
displayKey: 'value',
source: substringMatcher(states)
});
//set a value to input to trigger opening
$(".typeahead").eq(0).val("a").trigger("input");
//remove value for end user
$(".typeahead").eq(0).val("");
});
我使用这个手动触发选择，当tt-dataset中只有1个项目时。添加这个功能是很有意义的。
$("#mytypeahead").keyup(function (e) {
var charCode = (typeof e.which === "number") ? e.which : e.keyCode;
if (charCode == 13) {
if ($(this).parent().find(".tt-dataset").children().length == 1) {
//This is how we are submitting a single selection on enter key
$(this).parent().find(".tt-dataset").children(0).addClass("tt-cursor");
var kde = jQuery.Event("keydown");
kde.which = 13;
$(this).trigger(kde);
}
}
});
我尝试了这里的每种方法，但都没有起作用，只有使用
$(".typeahead").val('hi').trigger('keyup');
$(".typeahead").val('hi').trigger('keydown');