javascript - 使用 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;
     }
  })
);

但我收到错误:“无法获取未定义或空引用的属性"template"”

Answer 1

问题似乎是您正在引用 this 并且指向没有 templates 属性的函数 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)
);