Foundation Topbar and Hamburger using Angular

I was trying to make a fixed top bar in my layout with foundation xy-grid. i followed the doc and the building blocks but its not working. I am using Angular 11 but the foundation js is written in jquery.

I was trying to make this sidebar and top bar to be fixed. any solutions?

Development teams I have worked with that use Angular have either loaded jquery in addition to Angular to use Foundation javascript features OR they implemented Angular substitutes for those features, using Foundation mainly for the grid and styling.

Secondly, is anything going into the top header bar besides the logo? Perhaps you only need the topbar or sidebar fixed and not both. It’s a design decision to consider.