我试图实现Typeahead.JS
“Custom Template” example。
$('#custom-templates .typeahead').typeahead(null,{ name: 'best-pictures',displayKey: 'value',source: bestPictures.ttAdapter(),templates: { empty: [ '<div class="empty-message">','unable to find any Best Picture winners that match the current query','</div>' ].join('\n'),suggestion: Handlebars.compile('<p><strong>{{value}}</strong> – {{year}}</p>') } });
具体如下:
suggestion: Handlebars.compile('<p><strong>{{value}}</strong> – {{year}}</p>')
最初我没有意识到你需要明确地要求Handlebars作为依赖:
Uncaught ReferenceError: Handlebars is not defined
当我删除Handlebars …
suggestion: '<p><strong>' + value + '</strong> – ' + year + '</p>'
它给出另一个JS错误:
Uncaught ReferenceError: value is not defined
是否可以使用自定义视图模板,而不使用Handlebars引擎?
解决方法
使用此格式:
suggestion: function(data) { return '<p><strong>' + data.value + '</strong> – ' + data.year + '</p>'; }
取自this thread。