Polymer doesn't change paper-tab selected attribute

Question

I'm trying to make paper-tabs on my application. Tab 1 and Page 1 Have to be selected when page load , unfortunately when I'm trying to make attribute selected=0 page loads with tab1 active , but I cant change to any other tab , I always see only Tab 1 with Page 1 Can somebody please tell me what to do to fix that problem ??

Best Regards

I'm writing below what I've tried.

My import extensions

<link rel="import" href="../bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="../bower_components/core-pages/core-pages.html">
<link rel="import" href="../bower_components/core-ajax/core-ajax.html">

And Code:

   <paper-tabs selected="0">
            <paper-tab>Tab 1</paper-tab>
            <paper-tab>Tab 2</paper-tab>
            <paper-tab>Tab 3</paper-tab>
        </paper-tabs>

        <core-pages selected="0">
            <div>Page 1</div>
            <div>Page 2</div>
            <div>Page 3</div>
        </core-pages>

Second Option

         <paper-tabs selected="{{0}}">
            <paper-tab>Tab 1</paper-tab>
            <paper-tab>Tab 2</paper-tab>
            <paper-tab>Tab 3</paper-tab>
        </paper-tabs>

        <core-pages selected="{{0}}">
            <div>Page 1</div>
            <div>Page 2</div>
            <div>Page 3</div>
        </core-pages>

This is method I solved problem:

   Polymer('progress-page', {
        ready: function () {
            // make global values available on instance.
            this.selected = 0;
        }
});

Answer 1

Try selected="{{activeTabId}}" and in JavaScript set default value: activeTabId: 0