1

所以,我有一个保存到 Firebase 的 Polymer 项目。我的数据如下所示:

在此处输入图像描述

我想要做的是遍历teams数据中的属性。考虑到 Polymer 现在只循环遍历数组,这被证明是非常具有挑战性的(因为 Firebase 最好将数据作为对象返回)。到目前为止,我可以遍历keys并获取teams,但无法进入teamsto 遍历它。这是我的代码:

<template repeat="{{key in keys}}">
   <div class="tile">
       <paper-shadow z="2" class="card" animated>
           <div id="header" class="header"></div>

            <div class="content">
              <p>{{data[key]}}</p>
              <span>{{team.club}}</span>
            </div>

            <footer horizontal layout>
              <paper-button id="teamview" on-tap="{{viewTeam}}" flex>VIEW</paper-button>
              <span flex></span>
              <paper-button id="teamDelete" on-tap="{{deleteTeam}}">DELETE</paper-button>
              <paper-button id="teamEdit" on-tap="{{editTeam}}">EDIT</paper-button>
            </footer>
        </paper-shadow>
     </div>
 </template>

我觉得我几乎尝试了所有场景。每次我尝试再循环一个级别时,repeat="{{team in key}}"它都会中断。看看其他人是否对此有更好的看法?提前致谢!

4

2 回答 2

0

我认为您需要像这样绑定数据、ID 和键。

<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../firebase-element/firebase-element.html">
 
<!--
Element providing solution to displaying value from firebase.
##### Example
    <firebase-repeat-element></firebase-repeat-element>
@element fb-repeat-element
@blurb Element providing solution to displaying value from firebase.
@status alpha
@homepage http://basicelements.github.io/firebase-repeat-element
-->
<polymer-element name="firebase-repeat-element" attributes="firebaseName">
  <template>
    <firebase-element location="https://{{firebaseName}}.firebaseio.com/members/{{id}}" data="{{data}}" keys="{{keys}}"></firebase-element>
    <template repeat="{{id in keys}}">
      <h2>{{data[id]['name']}}</h2>
      <img src="{{data[id]['image']}}">
    </template>
 
  </template>
  <script>
    Polymer({
      
    });
  </script>
</polymer-element>

自由分叉它@ https://gist.github.com/ed2ba06d5a16d11381d9.git

于 2015-03-27T15:32:44.763 回答
0

因此,我发现的方式需要对 Polymer 和 Firebase 进行更深入的解释。首先,当您在 中输入location属性时firebase-element,无论何时采购datakeys,它都专门针对位置 - 而不是您的整体数据。

因此,我遇到的问题根源于我的location属性。一旦我更改了我的位置以指定我想要的确切嵌套级别push并从中获取数据 - 一切都很好。最终代码如下所示:

<firebase-element id="fbase" 
   location="https://volleyball-app.firebaseio.com/{{user.uid}}/userTeams" 
   data="{{userTeams}}" keys="{{keys}}" dataReady="{{userReady}}">
</firebase-element>

<template repeat="{{key in keys}}">
  <div class="content">
    <p>{{userTeams[key]['team']}}</p>
    <span>{{userTeams[key]['club']}}</span>
  </div>
</template>

这是在重复keys<firebase-element id="fbase" location="https://volleyball-app.firebaseio.com/{{user.uid}}/userTeams位置的所有内容(仅此而已)。从那里我抓住team每把钥匙的财产。

于 2015-03-30T20:54:00.160 回答