Question

与此问题类似，Init polymer attributes before ready()，但不完全相同。

在该子元素的ready事件触发之前，是否可以在Polymer中强制设置子元素的属性？

https://plnkr.co/edit/fM7lAflOLWOFuIiE7e9q?p=preview

的index.html：

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <script src="https://polygit.org/components/webcomponentsjs/webcomponents-lite.min.js"></script>
    <link href="https://polygit.org/components/polymer/polymer.html" rel="import">
    <link href="user-profile.html" rel="import">
  </head>

  <body>
    <user-profile></user-profile>
  </body>

</html>

用户profile.html：

<link href="https://polygit.org/components/polymer/polymer.html" rel="import">
<link href="address-card.html" rel="import">

<dom-module id="user-profile">
  <template>
    <address-card address$="{{address}}"></address-card>
  </template>
  <script>
    Polymer({
      is: "user-profile",
      properties: {
        address: {
          type: String,
          value: "Pass the value to the child"
        }
      }
    });
  </script>
</dom-module>

地址card.html：

<link href="https://polygit.org/components/polymer/polymer.html" rel="import">

<dom-module id="address-card">
  <template>
    {{content}}
  </template>
  <script>
    Polymer({
      is: "address-card",
      properties: {
        address: String
      },
      ready: function () {
        alert(this.address);
      }
    });
  </script>
</dom-module>

Answer 1

元素<user-profile>，将值{{primaryAddress}}传递给他的子元素<address-card>。元素<user-profile>是一个“中介者”，可以控制/分配给孩子的价值。

 <dom-module id="user-profile">
      <template>
        …
        <address-card address="{{address}}"></address-card>
      </template>
      … 
      properties: {
          address: {
          type: String,
          value: "Pass the value to the child"
          }
         }
    </dom-module>

Answer 2

在这种情况下，我使用数据绑定系统将值从父级传递给子级。

Linking paths with data bindings

在Polymer中准备好之前，声明性地设置属性以声明性地创建子元素

2 个答案: