CODEWITHSUNDEEP
javascriptpolymer-1.0
user2609832
user2609832

Reputation: 27

Polymer paper-tab with iron-pages model binding

How to handle model inside polymer iron-pages for paper-tab. See my code below:

<paper-tabs selected="{{selected}}">
 <paper-tab>Tab 1</paper-tab>
 <paper-tab>Tab 2</paper-tab>
</paper-tabs>
<iron-pages selected="{{selected}}">
 <div>
       {{model.tab1.content}} //not working
 </div>
 <div>
        {{model.tab2.content}} //not working
 </div>
</iron-pages>
<script>
        Polymer({
            is: "my-element",
            properties: {
                model: {
                    type: Object,
                    value: {tab1...}
                }
            }
        });
    </script>

So, model.tab1.content is not working inside iron-pages.

Upvotes: 0

Views: 1354

Answers (1)

Toby 1 Kenobi
Toby 1 Kenobi

Reputation: 5037

You can create a custom element that wraps both paper-tabs and iron-pages then the two way binding of the selected attribute will cause the tabs and pages to be in sync.

here is a link to a gist for easy-paper-tabs

Upvotes: 1

Related Questions