虽然这可能特定于“预先输入”的情况,并且我的示例具有静态内容,但实际上这适用于“数据源”的任何 Bootstrap 使用。我想有一天当我长大后使用动态内容来实现我的预输入,所以我现在尝试绑定(bind)方式:
Ember.TextField.reopen({
//add some bootstrap specific stuff
attributeBindings: ['data-provide', 'data-items', 'dataSourceBinding:data-source'],
'dataSourceBinding': Ember.Binding.oneWay('App.AddStoreTemplateController.statesArray')
});
我有一个带有 connectOutlets 的路由器,它附加了我的模板:
{{view Ember.TextField elementId="state" placeholder="NY/New York" valueBinding="state" data-provide="typeahead" data-items="4" data-source="App.router.addStoreTemplateController.statesArray"}}
我的 Controller :
AddStoreTemplateController: Ember.ArrayController.extend({
statesArray: ['Alabama', 'Washington']
}),
我希望看到以 HTML 呈现的内容:
<input id="state" class="ember-view ember-text-field" placeholder="NY/New York" type="text" data-provide="typeahead" data-items="4" data-source="['Alabama', 'Washington']">
它在 HTML 中实际呈现的内容:
<input id="state" class="ember-view ember-text-field" placeholder="NY/New York" type="text" data-provide="typeahead" data-items="4" data-source="App.router.addStoreTemplateController.statesArray">
预先输入文档 http://twitter.github.com/bootstrap/javascript.html#typeahead
非常感谢。我真的很喜欢 EmberJS!!
最佳答案
在稍微摆弄了一下之后,我想出了一个简单的方法来做到这一点。它不需要第 3 方库,您可以使用 Ember.TextField 来保持输入的美观:
我创建了一个新的扩展 TextField 对象来保持分离:
Ember.TextFieldTypeahead = Ember.TextField.extend({
//add some bootstrap specific stuff
attributeBindings: ['data-provide', 'data-items', 'data-source'],
'data-source': function(){
return JSON.stringify(["Alabama", "Washington"]);
}.property()
});
然后在我的模板中:
{{view Ember.TextFieldTypeahead elementId="state" placeholder="NY/New York" valueBinding="state" data-provide="typeahead" data-items="4" data-source=on}}
一切正常。唯一让我感到困惑的是,这可能是一个 Ember 错误或只是我的框架的新手状态,模板中的 data-source= 可以是任何东西,它仍然引用我声明的函数。只是将其保留为模板中的“数据源”会在 handlebars 构建时产生错误,因此我只是选择将值设置为“on”,这样当我出于某种原因重新访问代码时,我不会在 6 个月内感到困惑。好奇。
我还猜测我可以进一步扩展它以观察“值”,然后在值更改时使用我的服务器响应的任何 ajax 调用填充“数据源”属性以满足动态要求。
关于javascript - Emberjs,数据源,twitter bootstrap typeahead,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13637966/