Geek Answers Handbook

[dom-bind :: _ createEventHandler]: listener method not defined

I'm trying to use polymer, but I have a problem with registering methods and calling them. I tried everything on the Internet and nothing works, I spent too many hours on this, but with no results, please help me

here is my code:

<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>

Everything works fine, except for a button click, I get the following error:

 [dom-bind::_createEventHandler]: listener method `_addToCart` not defined
+5
source share
3 answers

Removing the dom-bind wrap will all work fine.

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

dom-bind is not required in element definitions. It is intended for use on regular HTML pages and launches a new “binding context” for your elements. That's why he does not find this method, because he is trying to find an event handler method outside the element definition.

+6
source

I think that you have already solved your problem, so for the rest you just replace the on-click with the on-tap event as follows:

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

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

and when ready:

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

More articles:


All Articles