Metronic Mega Update!Tailwind 4, React 19, Next.js 15, KtUI, ReUI, eCommerce, User Management Apps and more
Explore Update

Drawer open by default


how to make drawer open by default
also I am using angular app and I am trying to use this line KTDrawer.createInstances();

but I don't know from where I can import KTDrawer


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


If you're using KTDrawer.createInstances() in your Angular app, make sure the KTDrawer script is properly included from KeenThemes' core scripts. Typically, KTDrawer isn’t available as a standard Angular import, so you may need to include it in your angular.json under scripts or load it globally.

Also, if you're testing UI components like drawers and want to see live dynamic updates, you can check something like live draw systems—helps a lot in understanding event-based updates in real time.



The solution works perfectly, especially when you want to control component behavior on load. Just like when designing interactive features for kids’ pages—say, a fun paas kleurplaat section—you want things to be visible right away without extra clicks. This drawer method keeps the experience smooth and intuitive. Thanks for sharing!



Hi Hussien Helil

KTDrawer is designed for the HTML version of Metronic and is not intended for use in Angular applications. To achieve similar functionality in your Angular app, you can refer to the example code in the scripts-init.component.ts file located at /src/app/_metronic/layout/components/scripts-init/.

This file likely contains initialization logic for various components, including possibly the drawer component. You can check this file for examples of how components are initialized and used.

Thank you


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(