MeteorJS одну страницу-приложение навигации

Question

MeteorJS абсолютный нуб здесь, так нежна ... :)

Я пытаюсь создать веб-приложение на одну страницу, и я использую iron:router.

Идея состоит в том, что на странице есть несколько разделов, скажем, 3, один для меню, который никогда не меняется, и тот, где контент должен меняться в зависимости от выбора меню.

На обычной странице я просто загрузил содержимое в один div. Но с метеоритом/маршрутизатором я решил использовать функцию layoutTemplate и поместить общие части в один шаблон, а затем позвонить еще один с {{> yield}}.

Проблема 1: Это работало нормально, когда у меня был только шаблон/номер, но как только я представил шаблон/пользователь, он просто не загружается :(Он загружается на мгновение, а затем переходит к/комнаты, явно перезагружает/комнаты Теперь, конечно, что я делаю что-то неправильно, я просто не понимаю, что :(

Проблема 2:. это на самом деле перегружает всю страницу, когда он загружает/пользователя и затем возвращается в/комнату, что означает, что он каждый раз отключается и снова соединяется, есть ли способ избежать этого и фактически поддерживать его как одностраничное приложение, которое остается подключенным и загружает только один шаблон в div?

router.js:

Router.configure({ 
    notFoundTemplate: "404" 
}); 

Router.map(function() { 
    this.route('/', { 
     path: '/', 
     layoutTemplate: 'welcome', 
     onBeforeAction: function (pause) { 
      if (checkLogin()) { 
       Router.go('/room'); 
      } else { 
       this.next(); 
      } 
     } 
    }), 
    this.route('welcome', { 
     path: '/welcome', 
     layoutTemplate: 'welcome', 
     onBeforeAction: function (pause) { 
      if (checkLogin()) { 
       Router.go('/room'); 
      } else { 
       this.next(); 
      } 
     } 
    }), 
    this.route('room', { 
     path: '/room', 
     layoutTemplate: 'base', 
     onBeforeAction: baseAction 
    }), 
    this.route('user', { 
     path: '/user', 
     layoutTemplate: 'base', 
     onBeforeAction: baseAction 
    }) 
}); 

function baseAction(pause) { 
    if (!checkLogin()) { 
     Router.go('/welcome'); 
    } else { 
     this.next(); 
    } 
} 

function checkLogin() { 
    return Meteor.user() ? true : false; 
} 

base.js:

Template.base.events({ 
    "click #menu-logout": function() { 
     Meteor.logout(); 
    }, 
    "click #menu-room": function() { 
     window.location.href = '/room'; 
    }, 
    "click #menu-user": function() { 
     window.location.href = '/user'; 
    } 
}); 

base.html:

<template name="base"> 
    <div id="menu"> 
     <table style="height: 33px; width: 100%;"> 
      <tr> 
       <td id="menu-room"><img src="img/logo.png" /></td> 
       <td id="menu-user">me</td> 
       <td id="menu-logout">logout</td> 
      </tr> 
     </table> 
    </div> 
    <div id="content">{{> yield}}</div> 
    <div id="list">{{> tmpList}}</div> 
</template> 

room.html:

<template name="room"> 
    room data 
</template> 

user.html:

<template name="user"> 
    user data 
</template> 

Answer 1

По-видимому, никогда не должны сдаваться :)

Решение обеих проблем, перечисленных является не использования window.location для навигации, но и использовать Router.go вместо этого.

Это изменение в base.js фиксируется все:

Template.base.events({ 
    "click #menu-logout": function() { 
     Meteor.logout(); 
    }, 
    "click #menu-room": function() { 
     Router.go('/room'); 
    }, 
    "click #menu-user": function() { 
     Router.go('/user'); 
    } 
});