On Wed, Mar 16, 2016 at 10:38 AM Victor Wainer <[email protected]>
wrote:
> We are going nuts here trying to solve a problem that in principle seems
> to be pretty basic... we have been weeks at it, and we don't know what else
> to try, so... maybe someone here can help?
>
> We have created the same site in two different versions, and both
> approaches have hit different (to us) insurmountable obstacles...
>
> On one version we have created a template (let's call it mytemplate)
> composed of two sets iron-pages and paper-tabs that are nested.
> We use the properties id="pages" selected="0", id="tabs" selected="0",
> id="nested-pages" selected="0" and id="nested-tabs" selected="0" and bind
> them with this script:
> <script>
> var tabs = document.querySelector("#tabs"
> );
> var pages = document.querySelector("#pages");
> tabs.addEventListener("click", function (e) {
> pages.selected = tabs.selected;
> });
> var nestedTabs = document.querySelector("#nested-tabs");
> var nestedPages = document.querySelector("#nested-pages");
> nestedTabs.addEventListener("click", function (e) {
> nestedPages.selected = nestedTabs.selected;
> });
> </script>
>
> This version works well when the whole code is in one page. But it fails
> in Firefox (and Safari, etc...) if we try to use it as a custom element,
> and we call the template from another page, like this:
>
> <body unresolved>
> <mytemplate></mytemplate>
> </body>
>
> It does work well in Chrome.
>
> ----
>
> The other example does not use the script to bind the iron-pages and
> paper-tabs, but goes about it nesting one template inside the other and
> using selected="{{selected}}" instead on selected="0".
>
> It works, as far as functionality goes. No problems - except... when you
> open the page the default iron-page is empty. If you then click on any tab
> and navigate around the site, you can view the content of all page,
> including the initial one - but we cannot seem to get that first page to
> show inside the tab on page loading....
>
Data binding is definitely the way to go for something like this.
Are you setting an initial value for the `selected` property?
in properties:
selected: {
type: Number,
value: 0
}
In code:
elementOrTemplate.selected = 0;
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/b8f204ea-dde3-462f-a32d-74cadd1c150a%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/b8f204ea-dde3-462f-a32d-74cadd1c150a%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/CACGqRCBpFjDQO1DG0UESBKACMgvZd6wpi1vrRAQBneiwPsXQ7A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
