如何重置 typeahead.js 中使用的 Hogan.js 模板答案

【问题标题】：How to reset a Hogan.js template used in typeahead.js如何重置 typeahead.js 中使用的 Hogan.js 模板
【发布时间】：2013-07-18 19:49:24
【问题描述】：

我对 Hogan.js 和 typeahead.js 都是新手，所以这个问题可能很愚蠢。

$('.example-twitter-oss .typeahead').typeahead({                              
      name: 'twitter-oss',                                                        
      prefetch: 'repos.json',                                             
      template: [                                                                 
        '<p class="type">{{language}}</p>',                              
        '<p class="name">{{name}}</p>',                                      
        '<p class="description">{{description}}</p>'
      ].join(''),
      engine: Hogan
});

这就是我使用 Hogan.js 作为模板创建 typeahead.js 实例的方式。现在我想更改我的测试数据：'repos.json'，模板还是一样的。我猜它以某种方式缓存。如何重置我的模板以包含新数据？

我看到 hogan 有一个 compile();和 render() 方法，但我不明白如何使用它。

我都使用最新版本。

【问题讨论】：

标签： javascript typeahead.js hogan.js

【解决方案1】：

在当前版本的 typeahead.js (0.9.3) 中，数据集通过其 name 属性进行缓存，无法访问 bust the cache。所以如果你有：

$('.example-twitter-oss .typeahead').typeahead({
  name: 'twitter-oss',                                                        
  prefetch: 'repos.json',                                             
  template: [                                                                 
    '<p class="type">{{language}}</p>',                              
    '<p class="name">{{name}}</p>',                                      
    '<p class="description">{{description}}</p>'
  engine: Hogan
});

$('.example-something-different .typeahead').typeahead({
  name: 'twitter-oss',
  prefetch: 'something_different.json'
});

.example-something-different .typeahead 不会使用指定的配置，它会使用.example-twitter-oss .typeahead 指定的配置，因为它们使用相同的name。这并不直观，它将在下一个版本 v0.10 中进行更改。不过现在，您可以通过使用不同的names 来规避这个问题：

$('.example-twitter-oss .typeahead').typeahead({
  name: 'twitter-oss',
  prefetch: 'repos.json',
  template: [
    '<p class="type">{{language}}</p>',
    '<p class="name">{{name}}</p>', 
    '<p class="description">{{description}}</p>'
  ].join(''),
  engine: Hogan
});

$('.example-something-different .typeahead').typeahead({
  name: 'something different',
  prefetch: 'something_different.json'
});

【讨论】：