聚合物反映功能跨越元素

问题描述:

  1. 我有一个跨元素共享的行为。
  2. 在一个元素中,我有一个on-change =“_ toggle”开关。
  3. 在第二个元素中,我从没有开关按钮的第一个元素获得相同的代码。当开关激活时,它会反射到包含开关的元件。

问:我怎样才能在所有元素上反映on-change =“_ toggle”功能?聚合物反映功能跨越元素

我的代码:

1.

<script> 
    LanguageBehavior = { 

    behaviors: [ 
     Polymer.AppLocalizeBehavior 
    ], 

    properties: { 
     language: { 
     value: 'sl', 
     reflectToAttribute: true 
     }, 
    }, 

    attached: function() { 
     this.loadResources(this.resolveUrl('/data/locales.json')); 
    }, 

    _toggle: function() { 
     this.language = this.$.switch.checked ? 'en' : 'sl'; 
     // This function is the problem? 
    } 

    }; 
</script> 
<link rel="import" href="../../bower_components/polymer/polymer.html"> 
<link rel="import" href="../../bower_components/paper-toggle-button/paper-toggle-button.html"> 
<link rel="import" href="../../bower_components/app-localize-behavior/app-localize-behavior.html"> 
<link rel="import" href="behavior.html"> 

<dom-module id="bazdara-element-1"> 
    <template> 
    <style> 
     :host { 
     display: block; 
    } 
    </style> 
     {{localize('menu_2')}} // THIS CHANGES WITH THE SWITCH 
     <span title="english"> SI</span> 
     <paper-toggle-button on-change="_toggle" id="switch"></paper-toggle-button> 
     <span title="french">EN</span> 
    </template> 
    <script> 
    Polymer({ 
     is: 'bazdara-element-1', 
     behaviors: [Polymer.AppLocalizeBehavior, LanguageBehavior], 
    }); 
    </script> 
</dom-module> 
<link rel="import" href="../../bower_components/polymer/polymer.html"> 
<link rel="import" href="../../bower_components/app-localize-behavior/app-localize-behavior.html"> 
<link rel="import" href="behavior.html"> 

<dom-module id="bazdara-element-2"> 
    <template> 
    <style> 
     :host { 
     display: block; 
    } 
    </style> 
     {{localize('menu_2')}} // THIS Doesnt change 
    </template> 
    <script> 
    Polymer({ 
     is: 'bazdara-element-2', 
     behaviors: [Polymer.AppLocalizeBehavior, LanguageBehavior], 
    }); 
    </script> 
</dom-module> 

由于每个单元都会有自己的行为的复制你的做法是不去上班。现在唯一的选择,我可以拿出是:

  1. 保持你的元素在一个共同的元素,并在那里改变属性。
  2. 如果您打算将所有元素放在一个HTML文件中,则可以在该HTML文件中更改此功能并将该属性绑定到所有元素。
+0

在进一步搜索我发现'纸烤面包'不允许一次打开多个烤面包。它已经在聚合物功能之外宣布了一个变量'currentToast',并且在整个敬酒过程中保持不变。也许你可以看看它的代码,它可能会有所帮助。 – a1626

+0

我有很多超过2个元素,我不能只使用一个元素。我想翻译整个应用程序...顺便说一下,它不是纸面吐司,我用它的纸张切换按钮 –

+0

我的建议是看它的代码,它可能会给你一些关于如何实现它的想法。无论如何,如果它是本地化你试图达到那么你为什么不尝试'i18n-msg'。 [这里是](https://ebidel.github.io/i18n-msg/components/i18n-msg/)相同的链接。 – a1626