iron-selector selected = {{}}绑定到iron-pages selected = {{}}(Switcheroo) [英] iron-selector selected={{}} binding with iron-pages selected={{}} (Switcheroo)

查看:91
本文介绍了iron-selector selected = {{}}绑定到iron-pages selected = {{}}(Switcheroo)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

因此,我用铁选择器制作了一个自定义菜单,并将其放在另一个包含铁页面的自定义元素中,并且我无法将菜单按钮与页面内容绑定在一起. 基本上是带有自定义元素的Switcheroo. 这是一些代码(简体):

So i made a custom-menu with iron-selector and put it inside on another custom element wich contains iron-pages and i can't bind the buttons of my menu with the content of the pages. Basically a Switcheroo with custom elements. Here is some code (simplified):

我的菜单

<dom-module id="my-menu">
  <style>
    :host {display: inline-block;        }
  </style>    
  <template>
    <iron-selector id="menu" selected="{{menuSelected}}" attr-for-selected="name-menu">
      <div name-menu="portfolio" class="button"></div>
      <div name-menu="about" class="button"></div>
      <div name-menu="contact" class="button"></div>
    </iron-selector>
  </template>

  <script>
    Polymer({
      is: 'my-menu',
      behaviors: [Polymer.IronSelectableBehavior],
      poperties:{
        menuSelected:{
          type: String,
          value: 'portfolio'
        }
      }
    });
  </script>
</dom-module>

和我的页面

<dom-module id="my-pages">
  <style>
    :host {display: inline-block;}
  </style>

  <template>

    <my-menu menu-selected="{{pageSelected}}"></my-menu>

    <iron-pages attr-for-selected="page" selected="{{pageSelected}}"> 
      <section page="portfolio"> Some Content </section>
      <section page="about"> Some Content </section>
      <section page="contact"> Some Content </section>
    </iron-pages>
  </template>

  <script>
    Polymer({
      is: 'my-pages',
    });
  </script>
</dom-module>

感谢您阅读本文! =)

Thanks for reading this! =)

推荐答案

您需要在menuSelected中添加"notify:true".使my-pages知道my-menu何时修改menuSelected的值.另外,正如其他人提到的那样,您需要修复属性的拼写.如下更改:

You need to add 'notify: true' to menuSelected. So that my-pages knows when my-menu modifies the value of menuSelected. Also as others mentioned, you need to fix the spelling of properties. Change it as below:

  properties:{
    menuSelected:{
      type: String,
      notify: true,
      value: 'portfolio'
    }
  }

这篇关于iron-selector selected = {{}}绑定到iron-pages selected = {{}}(Switcheroo)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆