2013-08-13 2 views
1

У меня есть div, который связан данными с использованием синтаксиса foreach для нокаута.Нокаут: DOM не обновляется до изменения размера

<div id="myDiv" data-bind="foreach: { data: myData }, myCustomBinding: { param: paramname }"> 
    <a id="myLink" class="myLink" data-bind="text: label"></a> 
</div> 

myData - наблюдаемый массив, содержащий данные. У меня есть нокаутирующий подписаться на MyData следующим образом:

myData.subscribe(function() { 
if (myData().length > 0) { 
    resizeDiv(); 
} 
}); 

В функции resizeDiv() Я пытаюсь удалить несколько ссылок из этого DIV и перейти к другому скрытому DIV, если размер всех элементов управления в совокупности составляет больше ширины div. Но проблема в том, что ширина элемента управления недоступна в данный момент времени. Ширина управления обновляется в DOM после небольшого изменения размера браузера. Я добавил событие изменения размера окна, которое вызывает тот же метод resizeDiv().

$(window).on('resize', function() { 
    resizeDiv(); 
}); 

Не уверен, что я смог передать свою проблему/озабоченность. Пожалуйста, дайте мне знать, если вам нужна дополнительная информация.

Обновление: Здесь находится скрипка http://jsfiddle.net/2m3Jk/7/. Но обработчик привязки не стреляет в скрипку. В моем приложении стрелка привязки запускается, и элементы меню перемещаются из одного div в другой, если я изменяю размер окна. Но не на загрузке страницы.

+1

Не могли бы вы создать скрипку, которая воспроизводит проблему. – Damien

+0

Похоже, проблема заключается в изменении resizeDiv(), но вы не разместили код для него. – scaryman

+0

Скрипка доступна здесь http://jsfiddle.net/2m3Jk/7/ – Sajid

ответ

1

Я не рекомендую использовать манипуляции dom с простого javascript, если он конкурирует с нокаутом в процессе рендеринга. Возможно, вы можете использовать привязку afterRender для вызова функции изменения размера: http://knockoutjs.com/documentation/template-binding.html#note-4-using-afterrender-afteradd-and-beforeremove

Смежные вопросы