divide the side bar into two components

Question

i have divide the upper part of sidebar(button click to toggle the sidebar) in one component and lower portion (menus)is in another component,then toggle button doesnt work ,what to do?Pls advice

Indhumathy Loganathan · Answer

Hi Hina, 
 
We have validated your reported query. We suspect that you have been including the header block inside a component page and Sidebar in another component page and wants to open the Sidebar based on the menu(hamburger icon) click.  
 
For your reference, we have prepared a sample where we render header block in the app.component.html page and the Sidebar in child.component.html page. We perform toggle for the Sidebar based on the menu(hamburger icon) click. Check the below code snippet. 
 




  leftToggle() { 
    let left = document.getElementById('left-sidebar').ej2_instances[0]; 
    left.toggle(); 
  } 
  rightToggle() { 
    let right = document.getElementById('right-sidebar').ej2_instances[0]; 
    right.toggle(); 
  } 
 
Sample: https://stackblitz.com/edit/sidebar-with-multiple-component?file=app/app.component.ts 
 
Please check the sample and let us know if you need any further assistance. 
 
Regards, Indhumathy L