纸按钮聚合物元件上的点击事件错误

时间:2016-03-09 15:57:42

标签: javascript polymer-1.0

我对聚合物中的元素有这个问题,我试图显示一个按钮,当按钮点击事件被触发时,我想调用一个函数。

控制台异常:

  

[my-blogentry :: _ createEventHandler]:侦听器方法toggle没有   定义

这是元素的源代码:

<dom-module id="my-blogentry">
<template>
    <style>
        :host {
            display: block;
        }
        .div-general{
      </style>
    <div class="div-general">
        <template is="dom-repeat" items="{{entries}}">
            <paper-material elevation="1" animated="true" class="paper-material-presentation">
                <div class="div-date-left">
                    <span>{{item.date}}</span>
                </div>
                <div>
                    <iron-image src$="../../images/{{item.image}}" style="width:128px; height:128px;" sizing="cover"></iron-image>
                    {{item.resume}} 
                    <paper-button id="bt_readmore" on-tap="toggle">Read More</paper-button>
                    <iron-collapse id="collapse">
                      <div>{{item.content}}</div>
                    </iron-collapse>
                </div>
            </paper-material>
        </template>
    </div>
</template>
<script>
    Polymer({
        is: 'my-blogentry',

        ready: function() {
            this.entries = [
                {id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
            ];
          }
    });
    toggle = function () {
            this.$.collapse.toggle();
        }
</script>

我将不胜感激。

1 个答案:

答案 0 :(得分:1)

您需要在Polymer元素代码

中移动toggle方法
  Polymer({
    is: 'my-blogentry',

    ready: function() {
        this.entries = [
            {id: '1', title: ‘xxx.', date: 'Tuesday, March 8, 2016', image:'im-blogdefault.png', resume:’xxx’,content:’xxxx’}
        ];
     },
     toggle: function () {
        // this.$.collapse.toggle();
        his.$$('#collapse').toggle();
     }
  });