polymer - auto-binding for panelSelectedChanged -
<template is="auto-binding"> <core-drawer-panel drawerwidth="180px" rightdrawer forcenarrow selected="{{panelselected}}"> </core-drawer-panel> </template> <script> var t = document.queryselector('template'); t.panelselectedchanged=function(){ console.log('panelselectedchange', this.panelselected) } </script>
is there way use ...changed feature in autobinding? can not wrap in polymer element because break other js frameworks around it.
edit: answer received jeff works perfect, want point out has non intuitive behavior
t.addeventlistener('template-bound', function() { document.queryselector('core-drawer-panel').addeventlistener('core-select', function(e) { console.log('selection changed:', e.detail.isselected) console.log('selection changed:', e.target.selected) }) })
on open drawer
selection changed: false selection changed: drawer selection changed: true selection changed: drawer
on close drawer
selection changed: false selection changed: main selection changed: true selection changed: main
i haven't tried myself, since don't have working example illustrates use of <core-drawer-panel>
, can see <core-drawer-panel>
includes <core-selector>
element maintains selected
state.
based on docs <core-selector>
, core-select
event should fired whenever selection state changes.
therefore, should able listen event , figure out when things have changed based on that, (untested):
document.queryselector('template').addeventlistener('template-bound', function() { document.queryselector('core-drawer-panel').addeventlistener('core-select', function(e) { console.log('selection changed:', e.detail); }); });
alternatively, can use observe-js
(which pulled in part of polymer library) detect when arbitrary variables change outside of polymer element. can use pathobserver observe changes { t: 'panelselected' }
in example.
i think approach of listening events when possible cleaner in particular case, observer approach more general solution problem , directly related panelselectedchanged
handler you'd within polymer element.
Comments
Post a Comment