我如何循环遍历一组键并以声明的方式使用firebase-query查询每个键?

时间:2017-02-16 22:19:54

标签: javascript html firebase polymer polymerfire

正如标题所示,我正在尝试使用firebase-query元素来查询一个键数组,作为回报,我应该从查询中获得每个键的一堆对象。这可以很容易地在java或swift中完成,但是当涉及到聚合物元素时,我无法弄明白。

我已尝试将firebase-query放入dom-repeat但似乎无法正常工作。我也尝试更改等于键,它似乎不会启动新键的查询。

请参阅下面的代码:

<!doctype html>
<html>
<head> 
</head> 
<body>
  <template is="dom-bind" id="scope">

       <!-- .......other code -->
      <!-- condKey is from the array I need to loop -->
      <!--through and array comes from another query-->

      <firebase-query
        id="myQuery"
        app-name="ProjectName"
        order-by-child="childName" 
        path = "/nodeKey"   
        equal-to=[[condKey]]  
        data="{{results}}">
      </firebase-query>

    <!-- ***data comes from another query -->

    <div id="listContainer">       
      <template is="dom-repeat" items=[[data]] as="item">    
        <div class="item">
        <div class$="{{_computeItems(item.key)}}"></div>
          <template is="dom-repeat" items={{results}} as="myresult">
            <div>[[myresult.key]]</div>
          </template>
        </div>    
      </template>
    </div>  


    <script> 
    scope._computeItems =  function(key) {
          console.log("key of query is: " , key); 
          scope.condKey = key ;                 
        }; 
    </script>
    </template> 

    <!-- .......other code -->
    </body>

3 个答案:

答案 0 :(得分:0)

您将使用js Promise.all来实现这一目标。您将每个XHR / .once()推入一个数组,然后针对该数据运行Promise.all。

答案 1 :(得分:0)

将值传递给new-element,使用模板=&#34; dom-repeat&#34;将解决您的问题。

  <div id="listContainer">       
      <template is="dom-repeat" items=[[data]] as="item">    
        <div class="item">
        <div class$="{{_computeItems(item.key)}}"></div>

          <template is="dom-repeat" items={{results}}>
            <new-element results="{{results}}"></new-elements>
          </template>

        </div>    
      </template>
    </div>  

新元素

      <template is="dom-repeat" items={{results}} as="myresult">
        <div>[[myresult.key]]</div>
      </template>

答案 2 :(得分:0)

所以我试图通过使用Polymer数据绑定并通过嵌套孩子来实现这一目标,每个孩子都自己进行查询以获得它所需要的东西,然后我就成了新手。以下是如何通过Polymer数据绑定和声明方式轻松完成。

<parent-element>
  <template is="dom-repeat" items="[[keyArrays]]">
        <child-element key="[[item]]"></child-elements>
  </template>
</parent-element> 

然后在每个子元素中,通过子元素定义中的firebase-query进行查询:

<dom-module id="child-element">

    <template>
     ....

     <firebase-query path="/path/[[key]]" data="{{_queryResult}}></firebase-query>

     <element-to-bind-result-with data="[[_queryResult]]"></element-to-bind-result-with>

    </template>
      ....
<dom-module>

希望它有所帮助。