Listener method inside auto-binding template? (Polymer 1.0)

Asked By: Anonymous

<template is="dom-bind">
    <custom-element></custom-element>
    <iron-ajax auto url="data.json" handle-as="json" last-response="{{data}}" on-response="receivedResponse"></iron-ajax>
</template>

In the example above “custom-element” needs to know when iron-ajax has received a response. The problem is that I don’t know where to put the “receivedResponse” method. How do I do this? I prefer to put it inside “custom-element”, but then I don’t know how to bind it to the “on-response” event of iron-ajax.

I could bind the “{{data}}” to a property of “custom-element” and have an observer for that property, but that feels like a hack and I’d like to find out the correct way of doing this.

Solution

Answered By: Anonymous

assign a id to the auto-binding template for ease of access

<tempalte id="app" is="dom-bind">

Then init the template in Javascript

var app = document.querySelector('#app');

and create the function.

app.receivedResponse = function () {
  // process response
}

in cases where you need to wait for all polymer elements to be stamped to the dom you wait for the ‘dom-change’ event

app.addEventListener('dom-change', function () {
  // dom is ready to work with
});

hope this helps…