嵌套的 dom-repeat 不显示任何内容

Question

我正在尝试执行嵌套的 dom-repeat，我没有任何错误，但我仍然有一个空的显示。检查元素，我可以看到数据实际上在那里，并且页面在空白之前显示了一些很短的时间。以下是代码的摘录：

     <iron-ajax auto url="http://localhost:8808/datal2" handle-as="json" last-response="{{top}}"></iron-ajax>
     <template is="dom-repeat" items="{{top.top}}" as="item">
       <div>
         <span id="l4-support-offering-[[index]]">{{item.l2}}</span>
       </div>

       <iron-ajax auto url="[[computeCompleteUrl(item.l2)]]" handle-as="json" last-response="{{top}}"></iron-ajax>
        <template is="dom-repeat" items="{{top.top}}" as="level24" index-as="indexl24">
          <div>
            <span id="l4-support-offering-l4[[indexl24]]">{{level24.l4}}</span>
          </div>
        </template>
     </template>
    <script>
    ........
      properties: {
    top: {
      type: Array,
      value: function() { return []; }
    },
    level24: {
      type: Array,
      value: function() { return []; }
    },
    ................

聚合物是v 1.8.0

我更改了代码：

 <p>
  Hello!
</p>
<iron-ajax auto url="http://localhost:8808/datal2" handle-as="json" last-response="{{lev2}}"></iron-ajax>

     <template is="dom-repeat" items="{{lev2.top}}" as="iteml2">
         <span id="l4-support-offering-[[index]]">{{iteml2.l2}}</span><br>
     <iron-ajax auto url="[[computeCompleteUrl(iteml2.l2)]]" handle-as="json" last-response="{{lev4}}"></iron-ajax>
            <template is="dom-repeat" items="{{lev4.l4byl2}}" as="level4" index-as="indexl24">
                <span id="l4-support-offering-l4[[indexl24]]">{{level4.l4}}</span>
            </template><br>

</template>
 <script>
Polymer({
  is: 'game',
  properties: {
    lev2: {
      type: Array,
      value: function() { return []; }
    },
    lev4: {
      type: Array,
      value: function() { return []; }
    }
  },
  computeCompleteUrl: function(level) {
    return 'http://localhost:8808/datal4byl2/' + level;
    console.log("manager is:" +level);
  },

现在我显示了一些东西，但它不正确。我有类似的东西

十1,2,3,4 Y1,2,3,4 Z1,2,3,4

虽然应该是（这只是一个例子）

十8,2,4Y6,8,5,2Z1,2,3,4

因此，它始终填充第一个列表中最后一个元素的数据。

Answer 1

您引用的是top.top但此变量不存在。您的top属性是Array类型，因此您无法执行top.top。首先，您必须遍历top属性，然后在嵌套dom-repeat - item.top中迭代（也许您只是错误地复制了代码）

Answer 2

最后，

在我将第二个 dom-repeat 更改为：

 <template is="dom-repeat" items="{{getLevelFours(item.l2)}}"  as="level24" index-as="indexl24">

以及使用的功能：

 computeCompleteUrl: function(level) {
     return 'http://localhost:8808/datal4byl2/' + level;
  },
 getLevelFours: function(level) {
     let theUrl = this.computeCompleteUrl(level);
     // http request based on url
     var xmlHttp = new XMLHttpRequest();
     xmlHttp.open( "GET", theUrl, false ); // false for synchronous request
     xmlHttp.send( null );
     var myjson = JSON.parse(xmlHttp.responseText)
     return myjson.l4byl2;