[dom-bind :: _ createEventHandler]: metodo listener non definito

Question

Sto provando il polimero, ma sto riscontrando un problema nella registrazione dei metodi e nel chiamarli, ho provato tutto su internet e niente sembra funzionare, ho speso troppi ore su questo, ma senza risultati, ti prego, aiutami

ecco il mio codice:

<dom-module id="products-list"> 
<template> 
<template is="dom-bind"> 
    <iron-ajax id="ajax" auto 
     handle-as="json" 
     last-response="{{ajaxResponse}}"></iron-ajax> 
    <div class="main"> 
    <template is="dom-repeat" items="[[ajaxResponse.dataResult]]"> 
     <paper-card heading="[[item.name]]" image="[[item.image]]" class="pb16 w100 flex layout horizontal"> 
      <div class="card-content">[[item.desc]]</div> 
      <div class="card-actions"> 
       <paper-item> 
        <strong>[[item.price]]</strong> 
        <div class="flex"></div> 
        <paper-button on-click="_addToCart" raised><iron-icon icon="icons:add-shopping-cart"></iron-icon>Add to cart</paper-button> 
       </paper-item> 
      </div> 
     </paper-card> 
    </template> 
</div> 
</template> 
</template> 
<script> 
    Polymer({ 
     is: "products-list", 
     ready: function() { 
      var baseUrl = getBaseURL(); 
      var token = getAccessToken(); 
      var namespace = getNamespace(); 
      var appKey = getAppKey(); 
      var appSecret = getAppSecret(); 
      var url = baseUrl + '/stream/product.json'; 
      var params = { 
       'page' : 0, 
       'size' : 25 
      }; 
      var headers = { 
       'X-Auth-Token' : token, 
       'X-NAME-SPACE' : namespace, 
       'X-APP-KEY' : appKey, 
       'X-APP-SECRET' : appSecret, 
      }; 
      var ajax = document.querySelector("#ajax"); 
      ajax.url = url; 
      ajax.headers = headers; 
     }, 
     properties: { 

     }, 
     _addToCart: function (e) { 
      console.log('You pressed button ' + e.model.item.name); 
     } 
    }); 
</script> 

Tutto funziona benissimo tranne clic sul pulsante, sto ottenendo il seguente errore:

[dom-bind::_createEventHandler]: listener method `_addToCart` not defined 

Answer 1

Rimozione del wrapping dom-bind tutto funzionerà bene.

<template is="dom-bind">...</template> 

dom-bind non è necessario nelle definizioni di elemento. È progettato per essere utilizzato nelle normali pagine HTML e avvia un nuovo "contesto di bind" per i tuoi elementi. Questo è il motivo per cui non trova il metodo, perché sta cercando di trovare il metodo del gestore di eventi al di fuori della definizione dell'elemento.

Answer 2

<paper-button id="addToCart" raised> 
    <iron-icon icon="icons:add-shopping-cart"></iron-icon> 
    Add to cart 
</paper-button> 

e pronto:

this.$.addtoCart.addEventListener('click',this._addToCart.bind(this)) 

Answer 3

Credo che tu abbia già risolto il problema, in modo da per gli altri basta sostituire on-click da on-tap evento come questo:

<paper-button on-tap="_addToCart">...</paper-button>