녹아웃이보기를 렌더링하는 동안 진행 표시 줄을 표시합니다.

녹아웃을 사용하여 템플릿을 통해 내용을 렌더링하는 복잡한 페이지가 있습니다. 렌더링하는 데 약 10 초 정도 걸리므로 진행되는 동안 진행률 표시 줄을 표시하고 싶습니다. 템플릿에 콜백을 추가하여 페이지를 깨뜨린 afterRender 메서드에 추가하려고 시도했습니다.이 메서드는 템플릿에서 생성 된 html로 수행하는 것과 더 관련이 있다고 생각합니다.녹아웃이보기를 렌더링하는 동안 진행 표시 줄을 표시합니다.

나는 또한 모든 호출에 진행 표시 줄을 업데이트하는 바인딩 처리기를 만드는 시도

  ko.bindingHandlers.updateProgressBar = { 
       init: function (element, valueAccessor) { 
        viewModel.updateProgressBar(); 
       } 
      };

을 ...

<ul data-bind="template: {name: 'genericItemTemplate', foreach: ChildItems}, updateProgressBar: true"></ul>

불행하게도, 방법마다 호출되는 않습니다 만, 템플릿은 렌더링이 완전히 끝날 때까지 UI가 업데이트되지 않으므로 내가 찾고있는 진행 상황을 얻지 못합니다.

저는 tmpl 템플릿 라이브러리를 사용하고 있습니다.

observableArray의 많은 항목을 통해 작업중인 템플릿의 진행 상황을 UI로 표시하려면 어떻게해야합니까 ??

출처

2011-11-22 Mark Robinson

하나의 선택은 별도의 배열에 초기 데이터를 배치하고 시작하여 대기열로 사용하는 것입니다. 임시 배열에서 "x"개의 항목을 연결하여 setTimeout의 실제 observableArray로 푸시합니다.

그런 다음 dependentObservable을 사용하여 완료율을 추적 할 수 있습니다. 여기

는 샘플입니다 http://jsfiddle.net/rniemeyer/fdSUU/

출처

2011-11-22 14:16:54

감사 라이언. 평소와 같이 찍었습니다. –

@RP Niemeyer - 데이터가 서버에 저장되는 경우 비슷한 것을 얻을 수있는 방법이 있습니까? – gkb

난 그냥 그 바이올린을 포크와 완벽한 기능 진행률 표시 줄을 몇 가지 스타일을 추가했습니다, 그것을 확인 : http://jsfiddle.net/Pegazux/h3UuG/

출처

2012-07-18 17:00:46

녹아웃이보기를 렌더링하는 동안 진행 표시 줄을 표시합니다.

답변

관련 문제