2014-09-02 5 views
2

템플릿을 표시하고 숨기는 유성 방법을 찾으려고합니다. 예를 들어 홈 버튼을 클릭하면 홈 템플리트가 표시되고 다른 모든 것은 숨겨집니다. 이 세션 변수 또는 종속성이 가능하지만 두 작업 중 하나를 얻을 수 없다는 것을 알고 있습니다.Meteor 템플릿 표시 및 숨기기

답변

8

Session 변수를 사용하여 달성 할 수 있지만 아마도 iron router package을 사용하고 싶을 것입니다. Template.dynamic 더 나은 솔루션을 사용하여,

<body> 
    {{#if isPage 'home'}} 
     {{> home}} 
    {{/if}} 
    {{#if isPage 'about'}} 
     {{> about}} 
    {{/if}} 
    <ul> 
     <li><button class="clickChangesPage" data-page='home'>Home</button></li> 
     <li><button class="clickChangesPage" data-page='about'>About</button></li> 
    </ul> 
</body> 

<template name="home"> 
    <p>Home!</p> 
</template> 

<template name="about"> 
    <p>About!</p> 
</template> 
if(Meteor.isClient){ 

    Session.setDefault('page', 'home'); 

    UI.body.helpers({ 
     isPage: function(page){ 
      return Session.equals('page', page) 
     } 
    }) 

    UI.body.events({ 
     'click .clickChangesPage': function(event, template){ 
      Session.set('page', event.currentTarget.getAttribute('data-page')) 
     } 
    }) 

} 

업데이트 2 개 화성 2016

으로는 주석에서 지적한 다음

Session 변수를 사용하여 솔루션입니다.

<body> 
    {{> Template.dynamic template=currentPage}} 
    <ul> 
     <li><button class="clickChangesPage" data-page='home'>Home</button></li> 
     <li><button class="clickChangesPage" data-page='about'>About</button></li> 
    </ul> 
</body> 

<template name="home"> 
    <p>Home!</p> 
</template> 

<template name="about"> 
    <p>About!</p> 
</template> 
if(Meteor.isClient){ 

    Session.setDefault('page', 'home'); 

    Template.body.helpers({ 
     currentPage: function(page){ 
      return Session.get('page') 
     } 
    }) 

    Template.body.events({ 
     'click .clickChangesPage': function(event, template){ 
      Session.set('page', event.currentTarget.getAttribute('data-page')) 
     } 
    }) 

} 
+0

덕분에 나는 철 라우터 그래서 볼 것이다 통해이 가능했다 모른다 : 여기 한 것을 사용하여 코드입니다. 세션 변수를 사용하여 예제를 제공 할 수 있습니까? – james

+1

@ 제임스, 내 업데이트 된 답변을 참조하십시오. –

+0

놀라운! 빠른 응답을 주셔서 감사 드리며 다른 사람들이 유성에 착수하는 데 도움이되기를 바랍니다. Stackoverflow 다시 하루를 저장 :-) – james