Javascript 如何像手风琴一样使用聚合物芯折叠？

这里有点卡住了。以下是我目前的js：

     Polymer('test-element', {

          toggleOne: function() {
              var colOne = this.$.collapseOne;
              colOne.toggle();
          },

          toggleTwo: function () {
              var colTwo = this.$.collapseTwo;
              colTwo.toggle();
          }
      });

下面是相应的html：

<div on-click="{{toggleOne}}">
    test test test
</div>

<core-collapse id="collapseOne">
    test test test test test
</core-collapse>

<div on-click="{{toggleTwo}}">
    test test test
</div>

<core-collapse id="collapseTwo">
    test test test test test
</core-collapse>

准备好了吗

colTwo.closed

反之亦然。我不想做这样可怕的事情：

if (colOne.closed && colTwo.closed && colThree.closed && colFour && ...)

我想，我需要让它们具有相同的功能，只是对如何格式化有点困惑，如果有人能提供一些信息的话？谢谢感谢您的帮助

---

编辑：我知道polymer有一个手风琴用户界面，但由于它是实验性的，我现在还不想使用它。

一种方法是使用

管理选择状态，并确保只有一个

处于打开状态：

<core-selector selected="{{selected}}">
  <template repeat="{{item, i in items}}">
    <core-collapse opened?="{{selected == i}}" fixedSize style="height:150px">
      <div>...stuff...</div>
    </core-collapse>
  </template>
</core-selector>

东西

通过一点额外的CSS，您可以得到如下结果：

---

啊，看看（不推荐的），它扩展了聚合物选择器（从前体到核心选择器）：）

这很好用！感谢您抽出时间回复我的帖子——您在I/O上的演讲确实启发了我学习框架：）

<core-selector selected="{{selected}}">
  <template repeat="{{item, i in items}}">
    <core-collapse opened?="{{selected == i}}" fixedSize style="height:150px">
      <div>...stuff...</div>
    </core-collapse>
  </template>
</core-selector>