javascript - Polymer 1.0- bind a event handler without having to make a custom element -

i have <div id="play-button-png" on-click="open-video"></div> in index.html. without making custom element, how can make event listener , bind in separate file? similar angular's controller, can bind element without having create directive.

you use 'dom-bind'template (also known 'auto binding template') https://www.polymer-project.org/1.0/docs/devguide/templates.html#dom-bind

<template is="dom-bind" id="app">   //document body   <div id="play-button-png" on-click="openvideo"></div> </template> 

then add function templates scope

var app = document.queryselector('#app'); app.openvideo = function () {   // when clicked }; 

edit: need wait template bound before manipulating anything. wait 'dom-change' event

app.addeventlistener('dom-change', function() {   // auto-binding template ready. });