Trying to get started with Flow Router and BlazeLayout. Currently, it seems to double-render my layouts.
<body>
...
{{> layout}}
</body>
<template name="layout">
<div class="container full-container">
<div class="row full-row">
<div class="col-md-2 left-bar" style="background:#800000;">
<div class="row">
<div class="col-md-12">
{{> avatar size="large" shape="circle"}}
</div>
</div>
</div>
<div class="col-md-10">
{{>Template.dynamic template=content}}
</div>
</div>
</div>
</template>
<template name="usercard">
...
</template>
<template name="home">
<div class="row">
{{#each playerslooking}}
{{> usercard}}
{{/each}}
</div>
</template>
<template name="find_page">
<div style="height:150px;width:150px;background:blue;">hello</div>
</template>
JS:
FlowRouter.route('/', {
action: function() {
BlazeLayout.render("layout", {content: "home"});
}
});
FlowRouter.route('/find/:_id', {
name: 'postfind.show',
action: function() {
BlazeLayout.render('layout', {content: "find_page"});
}
});
What happens is that it seems to double render my .full-row
for some reason. This puts all content below the page.
I’m guessing this is user error but im not sure what im doing wrong.
Paint skills:
What Im going for:
whats happening:
EDIT 1: What seems to be happening is that it doesnt render inside my <div class="col-md-10> as defined. Why would this be?
I’m thinking there is some unsaid rule about nested templates here or something, but i’m not sure whats causing this.
EDIT 2: So I was just going through some more tutorials trying to debug, and ran the following:
{{>Template.dynamic template=content}}