Data binding 聚合：如何访问集合中的单个项目

我正在创建一个聚合物元素，它显示了一个下拉列表，用于选择不同的div，我们在这里称之为sections。在下拉列表中选择项目时，应显示相应的部分。您可以认为这更像是一个Tab控件，而不是Tab头，我们有一个下拉控件。我想用各自的json对象绑定每个节，但使用类似索引的节[0]和节[1]不起作用

<polymer-element name="my-elem">
<template>
    <div class="sections">
            <select on-change="{{sectionChanged}}">
                <template repeat="{{ sections }}">
                    <option>{{ name }}</option>
                </template>
            </select>

            <div id="section_0" class="section-config" bind="{{ sections[0] }}">
                <div>{{ sec0Prop }}</div> 
                Just for simplicity I am showing only one div here. This div can actually be quite complex
            </div>

            <div id="section_1" class="section-config" bind="{{ sections[1] }}">
                <div>{{ sec1Prop }}</div>
                This section view will be different than that of section 0
    </div>

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

<script>
    Polymer('my-elem', {
        sections: [{ sec0Prop: 'I am section 1 property' }, { sec1Prop: 'I am section 2 property' }],
        showSection: function(index) {
            $(this.shadowRoot.querySelectorAll('.section-config')).hide();
            $(this.shadowRoot.querySelector('#section_' + index)).show();
        },
        sectionChanged: function(e) {
            this.showSection(e.target.selectedIndex);
        }
    });
</script>
</polymer-element>

{{name}}
{{sec0Prop}}
为了简单起见，这里我只展示了一个div。这个div实际上可能相当复杂
{{sec1Prop}}
此剖面视图将不同于剖面0的剖面视图
聚合物（“my-elem”{
节：[{sec0Prop:'我是节1属性'}，{sec1Prop:'我是节2属性'}]，
showSection:功能（索引）{
$（this.shadowRoot.querySelectorAll（'.section config'））.hide（）；
$（this.shadowRoot.querySelector（“#section”+index））.show（）；
},
更改部分：功能（e）{
此.showSection（e.target.selectedIndex）；
}
});

假设使用了jquery。

---

当我们无法使用“在模板中重复”时，您能否帮助我绑定集合中的单个项目，因为每个项目的视图不同？

您有id。因此获取项目的最佳方法是：此。$['section\'+index]。为什么不使用“核心页面”？有了“核心页面”，你就可以不用js了