It looks like you're repeating multiple elements with <div id="content">.
Those are in your Light DOM, they're not in the Shadow DOM, so you're
always going to select the very first #content when any of your handlers
run.

On Wed, Feb 4, 2015 at 7:28 PM, CragVFX <[email protected]> wrote:

> Hello,
>
> I am building a desktop app using polymer and so far it has been a blast
> but, I have hit a roadblock on my project. I am attempting to update the
> content in the main content div when the user hits the different topics on
> the side nav. Using the core-scaffold and some of the techniques from the
> single-page-polymer app example, I have this snippet showing my main div
> with id="content".
>
> <div layout horizontal center-center fit>
>       <core-animated-pages id="pages" selected="{{route}}"
> valueattr="hash" transitions="slide-from-right">
>         <template repeat="{{page, i in pages}}">
>           <section hash="{{page.hash}}" layout vertical center-center>
>             <div>
>             <h1>{{page.name}}</h1>
>             <div id="content"></div>
>             </div>
>           </section>
>         </template>
>       </core-animated-pages>
>     </div>
>
> When someone hits the side nav's it updates the {{route}}, from there I am
> handling this with the following js:
>
> var that = this;
> var pages = document.querySelector('#pages');
> that.setContent(pages.selected);
>
> template.setContent = function(view) {
>         console.log('setContent');
>
>         if (view === 'one') {
>             console.log('dash');
>
>             var content = document.getElementById('content');
>             while (content.firstChild)
> content.removeChild(content.firstChild);
>
>         } else if (view === 'two') {
>             console.log('post-view');
>
>             var content = document.getElementById('content');
>             while (content.firstChild)
> content.removeChild(content.firstChild);
>             var postView = document.createElement('post-view');
>             content.appendChild(postView);
>         }  ... etc.
>
> Even if I get the {{route}} as 'two' and even if it matches the if (view
> === 'two') ... it does not display my content. So how would you all
> recommend handling this? It seems rather sloppy the way I have it, but I
> need to clear the main area and then put new content in that main area for
> each of the side navs. And I know I could just write out each section in
> the html, but what fun is that.
>
> Help me if you can!
> Thanks!
>
> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/b4c9f403-d08e-4374-a9f8-24bb13b0bba8%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/b4c9f403-d08e-4374-a9f8-24bb13b0bba8%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
> For more options, visit https://groups.google.com/d/optout.
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAJj5OwAjm0PkiDtgzGCB7pZ1umd3iMVgUac-PcS0tk4mzKJX3Q%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to