Polymer drawer-panel wont close -
i have core-drawer-panel core-menu. able open drawerpanel when click on menu option. problem having when click on item in drawer panel not close. have added javascript code @ bottom copied spa demo on polymer-projects, still doesn't close.
<template is="auto-binding" id="template"> <core-drawer-panel id="drawerpanel"> <core-header-panel drawer id="drawer"> <core-toolbar id="navheader"> <span>menu</span> </core-toolbar> <core-menu selected="{{option}}" on-core-selected="{{selectedoption}} valueattr="data-category"> core-items... </core-menu> </core-header-panel> </core-drawer-panel> </template> <script> var template = document.queryselector('#template'); var navicon = document.getelementbyid('navicon'); var drawerpanel = document.getelementbyid('drawerpanel'); navicon.addeventlistener('click', function() { drawerpanel.togglepanel(); }); template.selectedoption = function(detail) { if(detail.isselected) { drawerpanel.close(); } } </script>
you have listen template-bound
event before can queryselector or add listeners inside template. try rewriting this:
<script> var template = document.queryselector('#template'); template.addeventlistener('template-bound', function() { var navicon = document.getelementbyid('navicon'); var drawerpanel = document.getelementbyid('drawerpanel'); navicon.addeventlistener('click', function() { drawerpanel.togglepanel(); }); this.selectedoption = function(detail) { if(detail.isselected) { drawerpanel.close(); } } }); </script>
Comments
Post a Comment