Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Blank Pages


Hello, I followed the instructions to set up Angular integration. While the app can load and show the home page, all subpages are blank. How can I get the content of other pages, like your demo site?


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 (2)


Hi

The Angular integration is a starter: it gives you the layout (sidebar, header, etc.) and one page per demo (the index/dashboard). It doesn’t ship Angular components for every demo page (account, plugins, store, user tables, etc.).

To get those pages into your Angular app you have two practical options:

1. Use the HTML version as reference
In your Metronic package you have the full HTML demos (e.g. in metronic-tailwind-html-demos, under dist/html/demo1 through demo10). Each demo there has all the pages (account, authentication, plugins, store, user tables, etc.). Open the .html file for the page you want, copy the main content (the part that would go inside your layout), and put it into an Angular component template. Then adjust any IDs/classes and wire up Angular (e.g. click handlers, forms, routing) as needed. So it’s “convert” in the sense of copy-from-HTML and adapt to Angular, not a one-click export.

2. Keep using the Angular starter for structure only
Use the Angular app for routing, layout, and assets. For any page that doesn’t exist in the starter, add a new route and component, then implement the content using the corresponding HTML demo page as the visual and markup reference.
So you do need to bring the content over from the HTML pages (by copying and adapting), but you’re not building from scratch, you’re reusing the existing HTML structure and styling from the demos.



Hi

The Metronic Angular you can use it as a starter. It helps you with the assets integration. For all demo pages, you can get the HTML version.

Thanks


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  :(