आइटम

Question

प्रतिपादन के लिए हैंडलबार/मूंछें और बूटस्ट्रैप टाइपहेड का उपयोग कैसे करें मैं हैंडलबार टेम्पलेट का उपयोग कर बूटस्ट्रैप-टाइपहेड द्वारा प्रदान की गई वस्तु को कस्टमाइज़ करना चाहता हूं। कोड को देखते हुए ऐसा लगता है कि डिफ़ॉल्ट आइटम <li><a href="#"></a></li> है।

मान लीजिए कि मैं अपने आइटम को प्रस्तुत करने के लिए हैंडलबार टेम्पलेट का उपयोग करना चाहता हूं।

मेरी राय है कि मुझे इस तरह से रेंडर फ़ंक्शन को फिर से परिभाषित करना चाहिए (1)।

मेरा प्रश्न है:
बूटस्ट्रैप-typeahead.js v2.1.0` के साथ (1) का उपयोग कैसे करना चाहिए?

यहां (2) विकल्पों के बारे में कोड है जो मैं $.fn.typeahead और (3) मेरे हैंडलबार्स/मूंछ टेम्पलेट पर जा रहा हूं।

---

(1)

var renderItem = function (ul, user) { 
    // user is the Backbone.Model 
    return $('<li></li>') 
     .data('item.autocomplete', user) 
     .append(autocompleteItemTemplate(user.toJSON())) 
     .appendTo(ul); 
}; 

---

(2)

element.typeahead({ 
    minLength: 3, 
    source: function() { 
     var users = app.userCollection; 

     users = _.map(users, function (user) { 
      return user.get('first_name') + ' ' + user.get('last_name'); 
     }); 
     return users; 
    } 
}); 

---

(3)

<a>{{ first_name }} {{ last_name}}</a> 

Answer 1

आप इस तरह विधि प्रस्तुत करना अधिलेखित कर सकते हैं:

element.data("typeahead").render = function (items) { 
    var that = this; 

    that.$menu.empty(); 
    items = $(items).map(function (i, item) { 
     i = renderItem(that.$menu, item).attr("data-value", item); 
     i.find("a").html(that.highlighter(item)); 
     return i[0]; 
    }); 

    items.first().addClass("active"); 
    return this; 
}; 

हालांकि, बाद से Typeahead के स्रोत संपत्ति हमेशा तार की एक सरणी या एक समारोह है कि तार की एक सरणी देता है होना चाहिए, में renderItem उपयोगकर्ता तर्क से कार्य करेंगे स्ट्रिंग हो, इसलिए मुझे लगता है कि आप हैंडलबार का उपयोग करने में सक्षम नहीं होंगे।