Polymer 聚合物组分间的双向结合

我有一个聚合物应用程序，有一些嵌套组件。我试图在组件之间共享属性值。我的想法是，我可以通过数据绑定来实现这一点。然而，我的尝试没有成功，这可以从这一点上看出。相关代码（我认为）如下：

每个视图都有一个

纸张切换按钮

。如果在一个视图中设置了切换按钮，我希望在另一个视图中显示相同的值。然而，事实并非如此。就像每个视图都在使用自己的

isEnabled

值一样。如图所示，我做了以下工作：

在每个视图（“view-1.html”和“view-2.html”）中创建了一个名为

isEnabled

的属性

在宿主组件（“shell.html”）中创建了名为

isEnabled

的属性

通过

{{}}

花括号语法使用双向绑定

我做错了什么？为什么在一个视图中设置的

isEnabled

值不能传播到另一个视图

---

谢谢大家!

您应该在视图中的

isEnabled

属性的定义中将

notify

设置为

true

。这是双向数据绑定（）所必需的。

首先：以命名元素的方式命名元素文件。将目录中的

shell

更改为

app shell

第二：正如用户Maria所说，只需为您希望能够进行数据绑定的每个元素声明一个

notify:true

属性，如下所示：

<dom-module id="view-1">
  <template>
    <h2>View 1</h2>
    <paper-toggle-button checked="{{ isEnabled }}">Is Enabled?</paper-toggle-button>
  </template>

  <script>
    Polymer({
      is: 'view-1',
      properties: {
        isEnabled: {
          type: Boolean,
          value: false,
          notify: true
        }
      }
    });
  </script>
</dom-module>

视图1
是否已启用？
聚合物({
是：“视图-1”，
特性：{
我可以：{
类型：布尔型，
值：false，
通知：正确
}
}
});

对

view-2

属性执行相同的操作

以下是使用双向数据绑定的plunkr：

希望对你有帮助

<dom-module id="view-1">
  <template>
    <h2>View 1</h2>
    <paper-toggle-button checked="{{ isEnabled }}">Is Enabled?</paper-toggle-button>
  </template>

  <script>
    Polymer({
      is: 'view-1',
      properties: {
        isEnabled: {
          type: Boolean,
          value: false,
          notify: true
        }
      }
    });
  </script>
</dom-module>