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

Popular posts from this blog

c++ - QTextObjectInterface with Qml TextEdit (QQuickTextEdit) -

javascript - angular ng-required radio button not toggling required off in firefox 33, OK in chrome -

xcode - Swift Playground - Files are not readable -