Twitter bootstrap 如何将Twitter typeahead.js与Jsrender编译函数一起使用

js文档展示了使用Hogan.js的示例，但我将使用Jsrender模板。任何模板引擎都可以使用，只要它支持预期的API。 下面是使用下划线.js模板的示例。 下面是一个配置示例，使用下划线.js在文档准备就绪时执行一次以下JavaScript来支持此操作：

 $(function($) {    
      _.compile = function(templ) {
         var compiled = this.template(templ);
         compiled.render = function(ctx) {
            return this(ctx);
         }
         return compiled;
      }
      $('.product-typeahead').typeahead({
         header: '<h3>Products</h3>',
         template: 
       '<p><strong><%= name %></strong>:&nbsp;$<%= price %></p>',
         name: 'products',
         valueKey: 'name',
         engine: _,
         local: [
            {
               id: 0,
               name: "Deluxe Bicycle",
               price: 499.98
            },
            {
               id: 1,
               name: "Super Deluxe Trampoline",
               price: 134.99
            },
            {
               id: 2,
               name: "Super Duper Scooter",
               price: 49.95
            }
         ]
      }).on('typeahead:selected', function(event, datum) {
         $('#productID').val(datum.id);
         $('#productPrice').val("$" + datum.price);
      });
   });

$（函数（$）{
_.compile=函数（模板）{
var compiled=this.template（temp）；
compiled.render=函数（ctx）{
返回此（ctx）；
}
编制报表；
}
$（'.product typeahead'）。typeahead({
标题：“产品”，
模板：
“：$
”，
名称：'产品'，
valueKey:'名称'，
引擎：，
本地：[
{
id:0，
名称：“豪华自行车”，
价格：499.98
},
{
id:1，
名称：“超级豪华蹦床”，
售价：134.99
},
{
id:2，
名称：“超级Duper滑板车”，
售价：49.95
}
]
}).on（'typeahead:selected'，函数（事件、数据）{
$（'#productID'）.val（datum.id）；
$（'#productPrice'）.val（“$”+datum.price）；
});
});

我需要使用JSrender模板引擎实现上面的字体自动完成。如何使用jsRender实现这一点？

---

提前感谢。

您是否尝试过此-包装

$。模板作为您的引擎：

var jsRenderEngine = {
      compile: $.templates
   };

$('.product-typeahead').typeahead({
   ...
   engine: jsRenderEngine,
   local: [
      ...
   ]
}).on('typeahead:selected', function(event, datum) {
   ...
});

或者扩展
$.templates
使其成为您的引擎-使其成为自己的“编译”方法！：

$.templates.compile = $.templates;

$('.product-typeahead').typeahead({
   ...
   engine: $.templates,
   local: [
      ...
   ]
}).on('typeahead:selected', function(event, datum) {
   ...
});

@MikMark：我在上面添加了另一种方法。你能确认它是否也有效吗？好的-我现在已经从我的答案中删除了它。谢谢