KnockoutJS模板和Twitter的引導/ JQuery的工具提示不工作

我已經加載Twitter的引導提示，並酥料餅在onload片段看起來像這樣：KnockoutJS模板和Twitter的引導/ JQuery的工具提示不工作

$('i[rel=tooltip]').tooltip({ 
    placement: "left" 
});

，直到我添加KnockoutJS模板這正常工作與靜態HTML（一些代碼爲簡潔起見省略）：

<div class="row-fluid" data-bind="foreach: events.slice(paginationStart, paginationStop())"> 
    ... 
    <li> 
     <i class="icon-calendar" rel="tooltip" data-original-title="Date"></i> <span data-bind="text: start">event.date</span> 
    </li> 
    ... 
</div>

然後工具提示根本不顯示。我已經嘗試了匿名和普通KnockoutJS模板

我想我明白髮生了什麼事情：KnockoutJS模板覆蓋Twitter Bootstrap初始化，因爲在導入Twitter Bootstrap JS文件後運行模板。但我不知道該怎麼做。我確實試圖把jQuery的東西放在ko.applyBindings之後，但那也沒有奏效。

來源

2012-03-31 Magnus

嗯......看來我可能正在尋找afterRender屬性。我會試一試。 – Magnus 2012-03-31 16:24:30

將您的發現/解決方案作爲答案進行發佈，並批准它來解決問題，這樣可以在未來幫助更多人。 – 2012-03-31 17:14:15

寫完這個問題後我很快就想到了，不敢相信我錯過了它。答案是在來自KnockoutJS tempting的afterRender回調中執行Twitter Bootstrap Javascript Plugin/JQuery。

例：屬性更改爲data-bind="template: { foreach: data, afterRender: bootstrapDecorate }"，並有bootstrapDecorate在你的基因敲除模型中的可調用的函數，其中運行任何初始化設置，您以前在body.onload功能了。

來源

2012-04-01 08:42:10 Magnus

擴展淘汰賽是相當真棒和容易。 – 2012-04-18 16:13:54

根據doco，建議使用自定義綁定來代替afterRender。請參閱註釋＃7中的註釋 - http://knockoutjs.com/documentation/foreach-binding.html#note_5_postprocessing_or_animating_the_generated_dom_elements – 2013-05-02 00:46:43

現在可能是，但您是否注意到這篇文章已超過一年？ – Magnus 2013-05-04 21:06:33

KnockoutJS模板和Twitter的引導/ JQuery的工具提示不工作

回答

相關問題