Polymer 1.0 dom-repeat 中的内容？

Question

我的问题是我找不到使用 <content> 标签绑定数据的方法。我想创建一个 table 元素，您只需要在其中传递一个标题数组和 object 数组，表示要使用的数据。

我显示数据的代码如下：

<template is="dom-repeat" items="{{rows}}">
    <td>{{item.Id}}</td><td>{{item.Descripcion}}</td>
</template>

但如果我使用这种方式，我的 table 元素仅在行具有 Id 或 Descripcion 属性时才有效。
我想做这样的事情：

<template is="dom-repeat" items="{{rows}}">
    <content></content><!--dynamic item-->
</template>

所以，当我调用我的 table 元素时，应该是这样的：

<my-table titles="[arrayOfTitles]" rows="[arrayOfRows]">
    <td>{{item.propertyOne}}</td><td>{{item.propertyTwo}}</td><td>{{item.propertyN}}</td>
</my-table>

其中 <td></td> 将包含要表示的数据。
这听起来很疯狂？有可能吗？

我试过使用 getDistributedNodes 函数，但我不知道如何使用它来做我想做的事。对不起我的英语不好。谢谢！任何帮助都会很棒！

编辑

当我使用我的元素时如下所示：

<my-table api-url="../../api/feeApi"
          headers='[{"title":"Id"},{"title":"Descripción"},{"title":"Abreviatura"},{"title":"Tipo"},{"title":"Monto($)"},{"title":"Cobrar a"}]'
          keys='["Id","Descripcion","ShortName","FeeType","Monto","NivelesEscolares"]'
          number-visible-rows="10">
</my-table>

现在，问题是如何使用 objects 更复杂，当我使用 Objects 或数组时，它们显示如下：
如您所见，当我使用 object 或数组显示 [object Object] 时，知道如何构建我的 table 声明来指示如果它有 objects？我想做这样的事情：

我的<tbody>就像@so_confused_说的：

        <tbody>
            <template is="dom-repeat" items="{{visibleRows}}" id="tableRow">
                <tr on-tap="rowSelected" class$="{{getClass(item.active)}}">
                    <template is="dom-repeat" items="{{item.row}}" id="tableData">
                        <td>{{item}}</td>
                    </template>
                </tr>
            </template>
        </tbody>

Answer 1

如果您不是一直使用相同的键进行渲染，是否可以将您的输入用作数组的数组？

如果你有一个数组：arr = [["one","two","three","four"],["one","two"],["one","two","three"]]; 那么你可以通过遍历嵌套数组来呈现不同长度的行

<template is="dom-repeat" items="{{arr}}">
  <tr>
    <template is="dom-repeat" items="{{item}}>
      <td>{{item}}</td>
    </template>
  </tr>
</template>

Answer 2

        <tbody>
            <template is="dom-repeat" items="{{visibleRows}}" id="tableRow" as="row">
                <tr on-tap="rowSelected" class$="{{getClass(row.active)}}" style="cursor:cell;">
                    <template is="dom-repeat" items="{{headers}}" id="tableRow2" as="column">
                        <template is="dom-if" if="{{areEquals(column.type, 'object')}}">
                            <td>{{getObjectValue(column,row)}}</td>
                        </template>
                        <template is="dom-if" if="{{areEquals(column.type, 'array')}}">
                            <td>
                                <template is="dom-repeat" items="{{getDataArray(column,row)}}">
                                    <li>{{getArrayValue(item,column)}}</li>
                                </template>
                            </td>
                        </template>
                        <template is="dom-if" if="{{areEquals(column.type, 'text')}}">
                            <td>{{getValue(column,row)}}</td>
                        </template>
                    </template>
                </tr>
            </template>
        </tbody>

根据你调用相应函数的列类型。

Polymer 1.0 dom-repeat 中的内容？

content inside dom-repeat in Polymer 1.0?

javascript

data-binding

dom

polymer

编辑