로드 막대가있는 AJAX로 거대한 데이터 배열로드

Question

약 1300 개의 json 객체를 반환하는 ajax 요청이 있습니다. 이 객체 중 일부 ArrayProxies 및 뷰를 채 웁니다. 각 ArrayProxy보기에는 약 15 개의 개체와 이러한 개체에 대한 자세한 정보가 들어 있습니다.

여기저기서 모든 논리 때문에 모든 데이터가로드 될 때까지 약 5 초가 걸렸습니다.

이제로드 바 같은 것을 만들 수있는 방법이나 적어도 각 뷰를 개별적으로 렌더링 할 수 있어야합니다.

내 아약스 로딩 코드는 간단하다 : 어떤 조건에 해당하는 반환 후

$.getJSON('http://json.url, function(data) { 
    $.each(data, function(i, obj) { 
     var obj = App.ObjModel.create(obj); 
     if (obj.get('isCalculable')) { 
      App.ObjController.addObj(obj); 
     } 
    }); 
}); 

하지만 어떻게 내가보기를 렌더링 할 수있는 응용 프로그램을 알 수 있습니까? 어떤 도움

들으, 디마

Answer 1

당신은 사업부 또는 뭔가 내부에 로딩 이미지를 사용하여 요청의 시작 및 종료시의 표시를 전환 할 수 있습니다.

Ajax 요청이 시작됩니다 :

document.getElementById("LoadingImage").style.display="block"; 

를이 완료 후 :

document.getElementById("LoadingImage").style.display="none"; 

Answer 2

는 엠버가 데이터를로드 할 때 알아 내기 위해 일을하자. 데이터가로드되어 있지 않은 경우보기에 체크 인하십시오. 그렇지 않은 경우 애니메이션 GIF 등을 표시하십시오. 이것은 사용자에게 데이터가 아직 준비되지 않았 음을 알려줍니다.

이 같은 뭔가보기에이 작업을 수행 할 수 있습니다

{{#if controller.isLoaded}} 
    Display controller.content in loop or something 
{{else}} 
    <img src="/spinner.gif"> Loading data... 
{{/if}} 

이 코드 예제는 offical 한 엠버 웹 사이트에서 적용된다. 맨 끝에는 here이 있습니다.