Typeahead 和 Ember.handlebars答案

【问题标题】：Typeahead and Ember.handelbarsTypeahead 和 Ember.handlebars
【发布时间】：2014-03-24 19:36:55
【问题描述】：

我正在尝试使用 elasticsearch 后端实现 Typeahead。搜索本身似乎正在工作，现在我正在尝试调整光学。我想使用我编写的 Ember.Handlebars 助手。我的第一次尝试是使用手把作为模板引擎：

App.SearchComponent = Ember.TextField.extend({

  didInsertElement: function() {
    App.UserSearchEngine.initialize();
    this.initializeTypeahead();
  },

  initializeTypeahead: function(){
      var _this = this;
      this.typeahead = this.$().typeahead({
          hint: true,
          highlight: true,
          minLength: 3
        },
        {
         name: _this.$().attr('id') || "typeahead",
         // template: 'My: {{firstName}}',
         limit: this.get("limit") || 5,
         source: App.UserSearchEngine.ttAdapter(),
         templates:{
            suggestion: Ember.Handlebars.compile('{{firstName}} {{lastName}}')
         }
        }
      );
  }

});

这给了我一个错误：

未捕获的类型错误：无法读取未定义的属性“容器” 由 Ember 引起的 "_triageMustache" 助手行中的

 var helper = Ember.Handlebars.resolveHelper(options.data.view.container, property);

这可能是因为我尝试直接编译模板。

如果我使用 Handlebars.compile() 而不是 Ember.Handlebars.compile() 它会起作用。好像上下文不正确。

【问题讨论】：

这个有消息吗？

标签： ember.js handlebars.js typeahead.js

【解决方案1】：

您实际上应该在这里使用常规的Handlebars.compile。 Typeahead 库对 Ember 绑定模板一无所知，因此它不知道如何调用它们。

或者，您的模板非常简单，它可能只是一个文字函数，以省去在生产环境中运送 Handlebars 编译器或专门预编译该编译器的麻烦：

templates: {
  suggestion: function(context){ return context.firstName + ' ' + context.lastName; }
}

【讨论】：