어떻게하면 colorbox의 기본 데이터를 업데이트 할 수 있습니까?

사진 갤러리에 knockout.js와 colorbox를 결합하려고합니다.어떻게하면 colorbox의 기본 데이터를 업데이트 할 수 있습니까?

나는 관찰 배열의 모든 사진이, 그리고 코드는 다음과 같이 보입니다 : 나는 새 이미지를로드 colorbox를위한 이벤트 핸들러에 CURRENT_PHOTO를 업데이트

<script type='text/javascript> 
     function Photo(src, comment) { 
      this.image = src; 
      this.comment = ko.observable(comment); 
     } 

     var view_model = { 
      photos: ko.observableArray([ 
       new Photo('/gallery/img1.jpg', 'Some comment'), 
       new Photo('/gallery/img2.jpg', 'Some other comment'), 
       new Photo('/gallery/img3.jpg', '') 
      ]), 
      current_photo: ko.observable() 
     }; 

     $(document).ready(function(){ 
      $('ul#gallery').colorbox({href: '#photo-detail'}); 
     }); 
    </script> 

    <script id='photoTemplate' type='text/html'> 
     <li> 
      <img src='{{src}}' /> 
      <div>{{comment}}</div> 
     </li> 
    </script> 

    <body> 
     <ul id='gallery' data-bind='template: "photoTemplate, foreach:photos"'</ul> 

     <div style='display: none'> 
      <div id='photo-detail'> 
       <img data-bind='attr: { src: current_photo().src }'/> 
       <input type="text" data-bind='value: current_photo().comment'/> 
      </div> 
     </div> 
    </body>

합니다. 모든 것은 내가 의견을 편집 할 때까지 작동합니다.

마치 녹아웃이 DOM 요소를 제거하고 새 것으로 바꾼 것처럼 보이므로 다음 사진으로 이동 한 다음 다시 컬러 박스 버그가 발생합니다. colorbox를 닫고 다시 초기화하면 다시 작동합니다.

닫지 않고 colorbox의 데이터를 업데이트하는 방법이 있습니까?

출처

2011-11-01 Simon

난 그냥 넉 아웃 1.3을 사용하는 대신 JQuery와 템플릿을 사용하여 생각하고 새로운 foreach는 바인딩 : 당신이하지 않도록

http://blog.stevensanderson.com/2011/08/31/knockout-1-3-0-beta-available/

<ul data-bind="foreach: products"> 
    <li> 
     <strong data-bind="text: name"></strong> 
     <em data-bind="if: manufacturer"> 
      &mdash; made by <span data-bind="text: manufacturer.company"></span> 
     </em> 
    </li> 
</ul>

그것은 기본적으로 그냥 부모 아래에있는 노드를 복제 훨씬 더 복잡하지 않는 한 템플릿을 사용해야합니다.

당신이 사용하는 jquery 템플릿 구현이 아마 colorbox를 죽이는 노드를 재현한다는 것이 맞습니다. 새로운 foreach 구현은 노드를 제자리에두고 더 잘 작동해야한다고 생각합니다.

사용자 지정 녹아웃 바인딩이나 목록을 색 상자에 바인딩 할 필요가있을 수 있지만 실패하면.

출처

2011-11-01 19:10:04

새로운 foreach 바인딩이 완벽하게 작동합니다! 감사! – Simon

어떻게하면 colorbox의 기본 데이터를 업데이트 할 수 있습니까?

답변

관련 문제