聚合物反映功能跨越元素
问题描述:
- 我有一个跨元素共享的行为。
- 在一个元素中,我有一个on-change =“_ toggle”开关。
- 在第二个元素中,我从没有开关按钮的第一个元素获得相同的代码。当开关激活时,它会反射到包含开关的元件。
问:我怎样才能在所有元素上反映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>
答
由于每个单元都会有自己的行为的复制你的做法是不去上班。现在唯一的选择,我可以拿出是:
- 保持你的元素在一个共同的元素,并在那里改变属性。
- 如果您打算将所有元素放在一个HTML文件中,则可以在该HTML文件中更改此功能并将该属性绑定到所有元素。
在进一步搜索我发现'纸烤面包'不允许一次打开多个烤面包。它已经在聚合物功能之外宣布了一个变量'currentToast',并且在整个敬酒过程中保持不变。也许你可以看看它的代码,它可能会有所帮助。 – a1626
我有很多超过2个元素,我不能只使用一个元素。我想翻译整个应用程序...顺便说一下,它不是纸面吐司,我用它的纸张切换按钮 –
我的建议是看它的代码,它可能会给你一些关于如何实现它的想法。无论如何,如果它是本地化你试图达到那么你为什么不尝试'i18n-msg'。 [这里是](https://ebidel.github.io/i18n-msg/components/i18n-msg/)相同的链接。 – a1626