【发布时间】：2014-07-03 08:03:53
【问题描述】：
我按照本教程构建了一个多步骤表单：http://scotch.io/tutorials/javascript/angularjs-multi-step-form-using-ui-router 一切正常。
我现在想在这些表单上使用 Twitter 的 typeahead.js。所以我需要对使用 angular-ui-router 加载的输入进行预先输入调用。
我注意到 angular-ui-router 提供了一个onEnter 回调，当状态变为活动状态时会调用该回调。从那里调用 typeahead 函数似乎不起作用，似乎调用是在视图加载之前进行的（不是 100% 确定的）。
如何在加载了 angular-ui-router 的输入字段上初始化 typeahead？
我尝试了什么：
.state('questionnaire.relationship', {
url: '/relationship',
templateUrl: 'questionnaire/relationship.html',
onEnter: function(){
var relationshipList = ['brother', 'sister', 'father', 'mother'];
var relationships = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
local: $.map(relationshipList, function(relationship) { return { name: relationship }; })
});
relationships.initialize();
$('#bloodhound .typeahead').typeahead({
hint: true,
highlight: true,
minLength: 1
},
{
name: 'relationships',
displayKey: 'name',## Heading ##
source: relationships.ttAdapter()
});
alert('finished');
}
})
当进入questionnaire.relationship 状态时，我在视图前看到了警报弹出窗口。然后带有我输入的视图正确加载，但预输入不起作用。控制台没有js错误。
我还确保 typeahead 调用在 angular-ui-router 之外使用时正常工作。
【问题讨论】：
标签： angularjs angular-ui-router typeahead.js