ไม่สามารถเรียกการสลับ Core Collapse ภายในเทมเพลตทำซ้ำ Polymer

ฉันกำลังพยายามสลับแผงยุบหลักที่เรียกว่าภายในองค์ประกอบเทมเพลตที่ทำซ้ำ ฉันได้ระบุ ID แบบไดนามิกให้กับองค์ประกอบการล่มสลายหลัก แต่เมื่อแตะแล้วมันบอกว่า: Uncaught TypeError: boolean is not a function

รหัสของฉันคือ:

<template>
    <template repeat="{{ data }}">
        <style>
            ......
        </style>
        <paper-shadow z="1" class="card">
            <span class="info-bar">{{ cardID }}</span>
            <div vertical layout>
                <div>
                    <div horizontal layout>
                        <div flex style="color:#757575;">
                            <span>Date : </span><br /><span>March 15, 2015</span>
                        </div>
                        <div style="text-align:right;">
                            <paper-icon-button flex icon="subject" style="color:#ed485c;" on-tap="{{ toggle }}" id="{{ cardID }}"></paper-icon-button>
                            <paper-icon-button flex icon="social:share" title="clear" style="color:#ed485c;"></paper-icon-button>
                        </div>
                    </div>
                </div>
                <core-collapse id="{{ cardID }}">
                    <span> Collapse Content </span>
                </core-collapse>
            </div>
        </paper-shadow>
    </template>
</template>

สคริปต์ของฉันคือ:

<script>
    Polymer('i-card', {
        toggle: function (e, detail, sender) {
            var iid = e.target.templateInstance.model.cardID;
            this.shadowRoot.querySelector('#' + iid).toggle();
        },
        ready: function () {
            this.data = this.getData();
        },
        getData: function () {
            var data = [];
            for (var i = 0; i < 100; i++) {
                data.push({
                    cardID : 'icard-' + Math.floor(Math.random()*(1000-1+1)+1),
                });
            }
            return data;
        }
    });
</script>

ฉันต้องสลับองค์ประกอบการยุบตามลำดับในการแตะ