polymer - 如何进行全局firebase聚合物数据绑定？

Question

我想使用<firebase-login>用户对象来检查用户是否为我的元素登录。如何在不在每个自定义元素中调用以下代码的情况下全局化用户对象？

<firebase-login id="login"
                user="{{user}}"
                statusKnown="{{statusKnown}}" 
                location="FIREBASE_URL"
                provider="{{provider}}" 
                on-error="{{error}}"></firebase-login>

Answer 1

创建一个看起来像这样的自定义元素，

<polymer-element name="example" attributes="user">
 <template>
  <firebase-login 
    id="login"
    user="{{user}}"                
    statusKnown="{{statusKnown}}"                 
    location="FIREBASE_URL"
    provider="{{provider}}"                
    on-error="{{error}}">
  </firebase-login>
 </template>

  <script>
    Polymer({

    })
  </script>
</polymer-element>

然后使用pvc-globals或创建另一个传递 globals 的自定义元素 Polymer 有一个示例app-globals，其中展示了如何执行此操作。

<polymer-element name="app-example" attributes="globals">
  <template>
    <pvc-globals value="{{globals}}"></pvc-globals>
    <example-element user="{{user}}"></example-element>
  </template>
  <script>
    Polymer({
      ready: function () {
        this.globals.user = this.user;
      }
    });
  </script>
</polymer-element>

或者从示例元素中：

<polymer-element name="example" attributes="user globals">
 <template>
   <pvc-globals value="{{globals}}"></pvc-globals>
  <firebase-login 
    id="login"
    user="{{user}}"                
    statusKnown="{{statusKnown}}"                 
    location="FIREBASE_URL"
    provider="{{provider}}"                
    on-error="{{error}}">
  </firebase-login>
 </template>

  <script>
    Polymer({
      ready: function () {
        this.globals.user = this.user;
      }
    })
  </script>
</polymer-element>

希望这可以帮助！