无法使用纸质标签更改核心动画页面

时间:2015-05-13 10:36:54

标签: polymer

我正试图在我的聚合物应用程序中将core-animated-pagespaper-tabs挂钩。 Everyghing看起来很酷,但是当我点击core-animated-pages按钮时,我无法更改paper-tabs 我正在尝试使用This polymer tutorial,我的版本与教程非常相似,所以应该可以使用。很遗憾,我只能看到core-page

中的http://myapp/#one or #two活跃或我的网址正在变化

我的代码如下:

 <template id="templ" is="auto-binding">
            <div layout horizontal flex>
                <paper-tabs id="tabs" valueattr="hash"  selected="all" class="progress-tabs" self-end>
                    <template repeat="{{page in pages}}">
                        <paper-tab>{{page.name}}</paper-tab>
                    </template>
                </paper-tabs>
            </div>

            <div layout horizontal center-center fit>
                <core-animated-pages valueattr="hash" selected="{{hash}}"
                                     transitions="slide-from-right">
                    <template repeat="{{page in pages}}">
                        <section hash="{{page.hash}}" layout vertical center-center>
                            <div>{{page.name}}</div>
                        </section>
                    </template>
                </core-animated-pages>
            </div>

        </template>

脚本:

  <script>
    Polymer('progress-page', {
        ready: function () {
            var template = this.shadowRoot.getElementById("templ");
            template.pages = [
                {name: 'Single', hash: 'one'},
                {name: 'page', hash: 'two'}
            ];
        }}
    );
</script>

1 个答案:

答案 0 :(得分:0)

在纸质标签中使用“已选择”属性来获取所选标签的“哈希”值:

<paper-tabs id="tabs" valueattr="hash"  selected="{{selected}}" class="progress-tabs" self-end>

然后我们{{selected}}值来切换核心页面:

<core-animated-pages valueattr="hash" selected="{{selected}}"
                                 transitions="slide-from-right">

因此,'selected'属性会在标签和页面之间传递值。