使用 InstantSearch.js 在运行时选择不同的模板

Question

我希望能够根据从搜索中检索到的值更改模板。我想过像这样更改变量内容：

search.addWidget(
  instantsearch.widgets.hits({
     container: '#hits',
     hitsPerPage: 12,
     templates: {
        empty: noResultsTemplate,
        item: hitTemplate
     },
     transformData: function (hit) {
        if (hit.myVariable == true) {
          this.templates.item = otherTemplateVariable;
        }
        return hit;
     }
  })
);

但我得到一个错误：'Unable to get property 'templates' of undefined or null reference'

Answer 1

问题似乎是您正在引用 this 并且指向没有模板属性的函数 transformData，请尝试提取您的对象以访问它：

var data = {
     container: '#hits',
     hitsPerPage: 12,
     templates: {
        empty: noResultsTemplate,
        item: hitTemplate
     },
     transformData: function (hit) {
        if (hit.myVariable == true) {
          //access the templates attribute
          data.templates.item = otherTemplateVariable;
        }
        return hit;
     }
  };

search.addWidget(
  instantsearch.widgets.hits(data)
);