2014-04-04 3 views
0

라우터에서 Iron-router로 마이그레이션하려고하는데 내 페이지 전체가 올바르게 렌더링되지 않는 문제가 있습니다. 렌더링되는 유일한 템플리트는 "> 출력량"에서 생성되는 템플리트입니다. 내 HTML에있는 다른 코드는 렌더링되지 않습니다.라우터에서 Iron-Router로 마이그레이션하려고 시도했습니다.

페이지의 모든 항목이 정적으로 유지되기를 바랍니다. 하지만 URL을 기반으로 수율에 템플릿을 변경하고 싶습니다. 그런 식으로 작동하도록 구성에서 무엇을 놓치고 있습니까?

HTML :

<head> 
    <title>carpool</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head> 

<body> 
    <div id="wrap"> 
    {{> page}} 
    <div class="container-fluid"> 
     <div class="row-fluid"> 
    <div class="span12"> 
     {{> header}}  
    </div> 
    <div class="row-fluid"> 
     <div class="span10"> 
     <template name="mainContent"> 
      {{> yield}} 
     </template> 
     </div> 
     <div class="span2"> 
     {{#if currentUser}} 
     {{> leaderboard}} 
     {{/if}} 
     </div> 
    </div> 
     </div> 
    </div> 
    <div id="push"></div> 
    </div> 

    <div id="footer"> 
    <div class="container"> 
     {{> footer}} 
    </div> 
    </div> 
</body> 

<template name="page"> 
    {{#if showAddEventDialogue}} 
    {{> addEvent}} 
    {{/if}} 
    {{#if showConfigLoginService}} 
    {{> configureLoginService}} 
    {{/if}} 
    {{#if showCalendarEventDetailsDialogue}} 
    {{> calendarEventDetailsDialogue}} 
    {{/if}} 
</template> 

JS : 나는이 누락 된

/* Only execute if this is the client */ 
if (Meteor.isClient) { 

// Client subscriptions 
Meteor.subscribe('allCarpoolEvents'); 
Meteor.subscribe('allCarpoolDebts'); 
Meteor.subscribe('allUsers'); 

// Do not render the <body> 
Router.configure({ 
    autoRender: true 
}); 

// Define Routes 
Router.map(function() { 
    this.route('calendar', { 
    path:'/calendar*', 
    template: 'mainContent', 
    layoutTemplate: 'calendar' 
    }); 
    this.route('list', { 
    path:'/list*', 
    template: 'mainContent', 
    layoutTemplate: 'list' 
    }); 
}); 
} 

답변

0

가장 큰 키는 철 - 라우터가 문서의 <body>을 대체합니다. HTML 문서의 <body>에서 내 서식 파일을 이동하면 제대로 작동합니다.

HTML :

<head> 
    <title>carpool</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head> 

<body> 

</body> 

<template name="mainContent"> 
    <div id="wrap"> 
    {{> page}} 
    <div class="container-fluid"> 
     <div class="row-fluid"> 
     <div class="span12"> 
     {{> header}}  
    </div> 
    <div class="row-fluid"> 
      <div class="span10"> 
     {{> yield}} 
     </div> 
     <div class="span2"> 
     {{#if currentUser}} 
       {{> leaderboard}} 
     {{/if}} 
     </div> 
    </div> 
     </div> 
    </div> 
<div id="push"></div> 
</div> 

<div id="footer"> 
    <div class="container"> 
    {{> footer}} 
    </div> 
</div> 
</template> 

<template name="page"> 
    {{#if showAddEventDialogue}} 
    {{> addEvent}} 
    {{/if}} 
    {{#if showConfigLoginService}} 
    {{> configureLoginService}} 
    {{/if}} 
    {{#if showCalendarEventDetailsDialogue}} 
    {{> calendarEventDetailsDialogue}} 
    {{/if}} 
</template> 

JS :

/* Only execute if this is the client */ 
if (Meteor.isClient) { 

    // Client subscriptions 
    Meteor.subscribe('allCarpoolEvents'); 
    Meteor.subscribe('allCarpoolDebts'); 
    Meteor.subscribe('allUsers'); 


    Router.configure({ 
    autoRender: true 
    }); 

    // Define Routes 
    Router.map(function() { 

    this.route('calendar', { 
     path:'/', 
     template: 'calendar', 
     layoutTemplate: 'mainContent' 
    }); 

    this.route('calendar', { 
     path:'/calendar*', 
     template: 'calendar', 
     layoutTemplate: 'mainContent' 
    }); 

    this.route('list', { 
     path:'/list*', 
     template: 'list', 
     layoutTemplate: 'mainContent' 
    }); 
    }); 
} 
여기 정정 코드는
관련 문제