2014-05-19 2 views
0

I 다음 핸들 템플릿이 -핸들 템플릿 데이터 전달

var homePage = 
    '<div>' + 
     '<div id="homepage">' + 
      '<div class="header"><h1>Venues</h1></div>' + 
      '<div class="scroller">' + 
       '<ul class="list">' + 
       '</ul>' + 
      '</div>' + 
     '</div>' 
    '</div>'; 
var template = Handlebars.compile(homePage); 

var venueList = 
    '<a href="#page1">' + 
     '<li>' + 
      '<div class="list-left">' + 
       '<div class="list-profile"></div>' + 
      '</div>' + 
      '<div class="list-right">' + 
       '<div class="list-title">{{name}}</div>' + 
       '<div class="list-span">{{address.town}}, {{address.county}}</div>' + 
      '</div>' + 
      '<div class="clear"></div>' + 
     '</li>' + 
    '</a>'; 

나는 장소의 목록을 얻기 위해 AJAX 호출을하는 기능을 가지고 있습니다. 그러면 var venueList을 템플릿으로 사용하여 var homepage이 채워집니다.

이 모든 것이 내가 원하는대로 작동하며 각 장소는 내 UL에 표시됩니다. 내가 이해하려고 노력하는 데 어려움을 겪고있는 것은 내 과정의 다음 단계입니다.

사용자가 장소를 클릭 할 수 있습니다. 그러면 클릭 한 장소에 대한 자세한 정보가있는 다음 페이지로 이동합니다. AJAX 호출에 사용하는 함수는 이름뿐 아니라 장소에 대한 모든 것을 검색합니다. 다음 페이지에서 주어진 장소에 대한 정보를 가장 잘 얻는 방법은 무엇입니까? 각 장소 정보의 배열을 저장하고 사용자가 클릭하는 장소 이름에 따라이 정보를 전달합니까? 그렇다면 어떻게하면 좋을까요?

템플릿 시스템을 사용하여 이것을 유지하고 싶습니다. handlebars가 저를 제공합니다.

편집

이것은 내가 내 하이브리드 응용 프로그램 내에서

$(window).on('hashchange', route); 

// Basic page routing 
function route(event){ 
    var page, 
     hash = window.location.hash; 

    if(hash === "#page1"){ 

    }else{ 
     var template = Handlebars.compile(homePage);   
     page = template(); 
    } 
} 

감사

답변

0

당신은 데이터를 저장하는 속성 HTML을 사용할 수를 "페이지"의 의미를 만드는 데 사용하고 무엇인가 각 항목에 대한 전체 기록

예컨대 당신의 handlerbars 템플릿에서

'<li data-venuedetails={{this}} '와

'> < 리 '

을 대체

하여 새 페이지 (세션, 쿼리 문자열로 데이터를 전달, 쿠키 몇 가지 방법이 있습니다 등) 그러나 귀하의 프로젝트에 대해 너무 많이 알지 않고도 섹션을 사용하여 한 페이지에 모든 것을 유지하는 것이 사용자 액션에 대한 기본을 숨기거나 숨길 수 있습니다. 마법사 컨트롤이 여기에서도 작동 할 수도 있습니다. 내 프로젝트가 그래서 그냥 JS 제한 하이브리드 앱입니다

+0

작은 overhard을해야 거기에 하나의 레코드 만 있다면

은 또는 당신은, 새로운 페이지에서 다른 Ajax 호출을 할 수 있습니다. 나는 사용자가 "변경"페이지를 내가 그 부분을 처리하는 코드로 질문을 업데이 트했을 때 감지하기위한 해시 변경을 듣고 있습니다. 그래서 사용자가 장소를 클릭 할 때. 새 템플릿에서 해당 data-rel에 액세스하는 방법을 모르겠습니다. – user3611576

관련 문제