Question

在这里完成Polyer noob尝试编写一个简单的小型Polymer应用程序。

我正在尝试做的是从自定义元素（客户端表）驱动我的铁页面导航，但无法弄清楚如何执行此操作。

我尝试过在表格中使用attr-for-selected和selected属性的各种排列，但这似乎不起作用。我也尝试在纸张按钮周围设置一个锚标签，几乎可以正常工作，但它会触发整页刷新，并在页面加载时不显示我的#clientInfo部分。

有关如何实现此目的的任何建议，链接到更好地解释Polymer中的路由/导航的文档（特别是在使用自定义元素的情况下），任何默认的Polymer元素我应该检查其来源等？

<!-- snippet from index.html -->
<iron-pages attr-for-selected="data-route" selected="{{route}}">
    <section data-route="home">
      <paper-material elevation="1">
        <h2>Clients</h2>
        <client-table></client-table>
           <a data-route="clientInfo" href="/">test</a>
      </paper-material>
    </section>

    <section data-route="clientInfo">
      <paper-material elevation="1">
        <h2></h2>
        <p>This is the users section</p>
        <a href="/users/Rob">Rob</a>
      </paper-material>
    </section>
</iron-pages>

<!-- snipped from client-table.html -->
buildTable: function() {
    var domTable = this.$.table;
    var tableData = this.parseTableJson(this.buildTableJson());
    var tableMarkup = this.buildTable_initTable() + "<tbody>";

    for (var index in tableData) {
        row = tableData[index];

        var rowMarkup = "<tr>";
        rowMarkup += "<td>" + row.clientFirstName + "</td>";
        rowMarkup += "<td>" + row.clientLastName + "</td>";
        rowMarkup += "<td>" + row.clientEmail + "</td>";
        rowMarkup += "<td>" + row.clientPhone  + "</td>";
        rowMarkup += "<td>" + row.clientZipCode  + "</td>";
        rowMarkup += "<td><paper-button><iron-icon icon='card-membership'></iron-icon></paper-button></td>";
        rowMarkup += "</tr>";

        tableMarkup += rowMarkup;
    }
    tableMarkup += "</tbody>";

    $(domTable).append(tableMarkup);
}

Answer 1

然后我找到routing.html。

聚合物更新自定义元素的路径

1 个答案: