meteor-typeahead：列表和选择

我已经通过npm安装了meteor-typeahead。 https://www.npmjs.org/package/meteor-typeahead 我也安装meteor-typeahead：列表和选择

meteor add sergeyt:typeahead

从https://atmospherejs.com/sergeyt/typeahead

我试图获取数据源属性示例功能，所以当用户开始我可以显示一个国家的名单。我已将所有国家插入集合中： -

Country = new Meteor.Collection('country');

集合已发布和订阅。

当我在输入字段中输入时，不会出现任何建议。这与启动API有关吗？如果是的话，我该怎么做？请参考网站https://www.npmjs.org/package/meteor-typeahead

我的形式如下：

<template name="createpost"> 
<form class="form-horizontal" role="form" id="createpost"> 
     <input class="form-control typeahead" name="country" type="text" placeholder="Country" autocomplete="off" spellcheck="off" data-source="country"/> 
     <input type="submit" value="post"> 
</form> 
</template>

client.js

Template.createpost.helpers({ 
country: function(){ 
    return Country.find().fetch().map(function(it){ return it.name; }); 
} });

来源

2014-09-26 meteorBuzz

为了让您的输入有预输入完成后，您需要：

使用包API激活预先定义的jQuery插件
- Meteor.typeahead调用模板呈现的事件处理程序。
- Meteor.typeahead.inject调用以激活页面上可用CSS选择器匹配元素的typeahead插件（请参阅demo app）。
在您的模板中写入'data-source'函数可以通过typeahead插件来理解。看起来你的'数据源'功能是正确的。
为键入输入/下拉菜单添加CSS样式到您的应用程序。请参阅演示应用中的示例here。

来源

2014-09-26 15:59:28 sergeyt

谢谢谢尔盖特，我会经历你提到的步骤。 – meteorBuzz 2014-09-26 16:15:58

Meteor.typeahead.inject（选择器）;代码去？对不起，我很困惑。我该如何称呼它？ – meteorBuzz 2014-09-26 16:28:09

在DOM就绪事件上调用它，即使用Meteor.startup（演示应用程序有[示例调用]（https://github.com/sergeyt/meteor-typeahead/blob/master/demo/demo.js#L165））。或者在模板呈现的事件处理器中调用它。 – sergeyt 2014-09-27 15:28:02

试试这个办法在你的模板：

<input type="text" name="country" data-source="country" 
    data-template="country" data-value-key="name" data-select="selected">

创建像country.html模板（例如/client/templates/country.html），其中包含：

<template name="country"> 
    <p>{{name}}</p> 
</template>

在您的客户javascript：

Template.createpost.rendered = function() { 
    Meteor.typeahead.inject(); 
}

和

Template.createpost.helpers({ 
    country: function() { 
    return Country.find().fetch().map(function(it){ 
      return {name: it.name}; 
     }); 
    }, 
    selected: function(event, suggestion, datasetName) { 
     console.log(suggestion); //or anything what you want after selection 
    } 
})

来源

2017-05-17 00:11:56 evgenyg

meteor-typeahead：列表和选择

回答

相关问题