Шаблоны KnockoutJS и Twitter Bootstrap / JQuery не работают - PullRequest
Новая
       23

Шаблоны KnockoutJS и Twitter Bootstrap / JQuery не работают

2 голосов
/ 31 марта 2012

У меня есть фрагмент, который загружает всплывающую подсказку Twitter Bootstrap и всплывающую подсказку в onload, выглядящую следующим образом: 

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

Это прекрасно работает со статическим HTML, пока я не добавлю шаблонизацию KnockoutJS (некоторый код опущен для краткости): 

<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, так как шаблонизация запускается при загрузке после импорта JS-файлов Twitter Bootstrap.Но я не знаю, что с этим делать.Я попытался поместить материал JQuery после ko.applyBindings, но это тоже не сработало.

1 Ответ

2 голосов
/ 01 апреля 2012

Я понял это довольно быстро после написания этого вопроса, не могу поверить, что пропустил это.Ответ заключается в том, чтобы сделать плагин Twitter Bootstrap Javascript Plugin / JQuery в обратном вызове afterRender из KnockoutJS tempating.

Пример: измените атрибут на data-bind="template: { foreach: data, afterRender: bootstrapDecorate }" и пусть bootstrapDecorate будет вызываемой функцией в вашей модели выбивки, в которой вы запускаетевсе настройки инициализации, которые вы использовали ранее в вашей функции body.onload.

...