Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Issue upgrading Angular 13 to 17


We are facing an issue related to the theme when we try to upgrade from Angular 13 to Angular 17.

Can you please let us know what we need to do so we can upgrade the theme also to the latest version?

Currently this issue is stopping us from upgrading the Angular version.


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)


You can follow the Angular upgrade guide provided by the official Angular team. This guide will assist you in navigating through the necessary steps.

Here is the link to the Angular update guide:
https://update.angular.io/?v=13.0-17.0

You'll find detailed instructions, version-specific information, and potential issues that may arise during the upgrade process.

Feel free to reach out if you encounter any specific issues or if you need further assistance with the upgrade process.



Hello,

We have followed the steps/instructions mentioned in the Angular website for upgrade. It works fine till Angular 15, but we are facing the issues mentioned in the original post when we try to upgrade the Angular 16/17. We did not upgrade Angular Material as mentioned in the steps, but it does not work. At some point it got upgraded to Angular 17, but none of the material styles are applies.
We have used the theme in more than 1 site and it works fine with the theme we used for one of them as it has a new folder structure. But for the older one it does not work.

Below is the link to the image that shows the error we are getting.

https://drive.google.com/file/d/1zqiW5345OdvhhrSVU3B-yNOx9QqYSsMz/view?usp=sharing

Any help is highly appreciated.

Thank you.



Thank you for reaching out and providing an update on your Angular upgrade process.

Angular Material is a separate library from Angular itself, and it's crucial to ensure compatibility between the versions of Angular and Angular Material. The versions of Angular Material and Angular should ideally match, eg. v17 for both.

Visit the Angular Material website: https://material.angular.io/guides

Upgrade Angular Material to the version that corresponds to your Angular version.

ng update @angular/material@<version>

Replace <version> with the specific version number that matches your Angular version (e.g., 17).

After upgrading Angular Material, rebuild your application to ensure the changes take effect.

ng build

If you encounter any further challenges or have additional questions, please feel free to reach out for assistance.

Thank you for your understanding and cooperation.


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