title: Twitter Typeahead and Handlebars
body: <p>I'm having a bit of trouble implementing an idea I had to make twitter's typeahead suggestion property a little dynamic.</p>
  
  <p>I have the following piece of code: </p>
  
  <pre><code>$(inputElement).typeahead({
          highlight: true,
          hint: false
      }, {
          name: 'engine',
          limit: 15,
          displayKey: config.displayKey,
          source: config.engine.ttAdapter(),
          templates: {
              empty: [
                  '&lt;div class="empty-suggestion-message"&gt;',
                      'No results matched your query.',
                  '&lt;/div&gt;'
              ].join('\n'),
              suggestion: Handlebars.compile('&lt;p&gt; &lt;span&gt;{{name}}&lt;/span&gt; - &lt;span&gt;{{email}}&lt;/span&gt; - &lt;span&gt;{{phone}}&lt;/span&gt; &lt;/p&gt;'),
          }
      });
  </code></pre>
  
  <p>In the Handlebars.compile part, I'm printing the source's response keys, name, email and phone. What I want to do is, having set an object to hold some config: </p>
  
  <pre><code>var _setConfig = function (url, query, displaykey, suggestion) {
      config.url = url;
      config.query = query;
      config.displayKey = displaykey;
      config.suggestion = suggestion;
      console.log(config.suggestion);
  };
  </code></pre>
  
  <p>I would like to change the suggestion part to:</p>
  
  <pre><code>suggestion: Handlebars.compile('&lt;p&gt; &lt;span&gt;{{config.suggestion[0]}}&lt;/span&gt; - &lt;span&gt;{{config.suggestion[1]}}&lt;/span&gt; - &lt;span&gt;{{config.suggestion[2]}}&lt;/span&gt; &lt;/p&gt;')
  </code></pre>
  
  <p>Assuming I pass in an array (e,g ['name', 'email', 'phone']) as the suggestion parameter to the _setConfig() function.</p>
  
  <p>Any ideas ??</p>
  
  <p>Thanks :D</p>