{"id":236,"date":"2020-07-10T12:35:58","date_gmt":"2020-07-10T12:35:58","guid":{"rendered":"https:\/\/www.hostarmada.com\/blog\/?p=236"},"modified":"2020-07-10T12:36:32","modified_gmt":"2020-07-10T12:36:32","slug":"get-to-know-the-new-angular-version-10","status":"publish","type":"post","link":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","title":{"rendered":"Get to know the new Angular version 10!"},"content":{"rendered":"<p><a href=\"https:\/\/angular.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">Angular<\/a> is a <a href=\"https:\/\/www.typescriptlang.org\/\">TypeScript<\/a>-based open-source framework for building mobile and desktop web applications. It is developed and supported by <a href=\"https:\/\/angular.io\/about?group=Angular\">Google&#8217;s Angular team<\/a>.<\/p>\n<p>A major upgrade of the framework has been released on the 24th of June, only four months after <a href=\"https:\/\/blog.angular.io\/version-9-of-angular-now-available-project-ivy-has-arrived-23c97b63cfa3\">version 9.<\/a> While this upgrade is not as impactful as the previous one, it affects the Angular framework, Angular Material, and the CLI. The primary purpose of version 10 is to keep everything up-to-date and well synchronized with the JavaScript ecosystem rather than include new features.<\/p>\n<p>Let&#8217;s jump right into it and explain what has been upgraded and what deprecated!<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 ez-toc-wrap-right counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #565656;color:#565656\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #565656;color:#565656\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#What_is_new_in_Angular_10\" >What is new in Angular 10?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#New_Date_Range_Picker\" >New Date Range Picker<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Warnings_about_CommonJS_Imports\" >Warnings about CommonJS Imports<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Optional_Stricer_Settings\" >Optional Stricer Settings<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Major_Changes\" >Major Changes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#New_Default_Browser_Configuration\" >New Default Browser Configuration<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Language_Service\" >Language Service<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Compiler_Update\" >Compiler Update<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#ngcc\" >ngcc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Localization\" >Localization<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Service_Workers\" >Service Workers<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Core\" >Core<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Bug_Fixes\" >Bug Fixes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Converting_pre-Ivy_code\" >Converting pre-Ivy code<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Deprecations_and_Removals\" >Deprecations and Removals<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#How_to_update_to_Angular_10\" >How to update to Angular 10<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#HostArmada_and_Angular_10\" >HostArmada and Angular 10<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Conclusion\" >Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"What_is_new_in_Angular_10\"><\/span>What is new in Angular 10?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"New_Date_Range_Picker\"><\/span>New Date Range Picker<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p style=\"text-align: left;\"><img decoding=\"async\" class=\"size-medium wp-image-241 alignleft\" src=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-300x72.png\" alt=\"\" width=\"300\" height=\"72\" srcset=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-300x72.png 300w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-24x6.png 24w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-36x9.png 36w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-48x12.png 48w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10.png 499w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>A new date range picker is included in the Angular Material UI component library. You can use the <code>mat-date-range-input<\/code> and <code>mat-date-range-picker <\/code>components to utilize the new picker. An overview example of it can be found on <a href=\"https:\/\/stackblitz.com\/angular\/nknyovevygv?file=src%2Fapp%2Fdate-range-picker-overview-example.html\" target=\"_blank\" rel=\"noopener noreferrer\">StackBlitz<\/a>.<\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Warnings_about_CommonJS_Imports\"><\/span>Warnings about CommonJS Imports<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>CommonJS modules could impact your application and make your JavaScript bundles larger than necessary. Angular 10 includes warnings for CommonJS imports, which will alert you when a dependency package with CommonJS may lead to more extensive and slower application. You will be allowed to substitute the dependencies with an ECMAScript module (ESM) bundle.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Optional_Stricer_Settings\"><\/span>Optional Stricer Settings<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Angular 10 allows you to utilize a strict mode project step when creating a new workspace with <code>ng new<\/code>.<\/p>\n<p><code>ng new --strict<\/code><\/p>\n<p>When the strict mode is enabled, it improves the maintainability of your project, helps you detect bugs in advance, and allows the CLI to perform advanced optimization on your app. The strict flag enables strict mode in TypeScript; sets template type checking to Strict; reduces default bundle budgets by ~75%; disallows the use of type <code>any<\/code> in the linting rules; and configures your app excluding unwanted effects to enable more advanced tree-shaking.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Major_Changes\"><\/span>Major Changes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Recently TypeScript released a new 3.9 version that comes with performance improvements, bug fixes, and new features. To keep everything up-to-date Angular responds with version 10, which supports it. All Angular users can have elaborate TypeScript configuration, faster compiler experience, error-checking, and quick fixes.<\/p>\n<p>The runtime library for TypeScript &#8211; TSlib, has been updated to version 2.0. Along with that, the static analysis tool for TypeScript, &#8211; TSLint,\u00a0 has been updated to version 6.<\/p>\n<p>The project layout has also been updated. A new <code>tsconfig.base.json<\/code> is introduced, and it carries the content of the root <code>tsconfig.json<\/code> file. The &#8220;Solution Style&#8221; concept of the <code>tsconfig.json<\/code> file is included in TypeScript 3.9 to prevail issues caused by the <code>tsconfig.json<\/code> file existing only to reference other <code>tsconfig.json <\/code>files. The additional <code>tsconfig.json<\/code> file improves IDE support as well as build tooling resolve type and package configurations.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"New_Default_Browser_Configuration\"><\/span>New Default Browser Configuration<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>An update on the browser configuration for new projects has been applied to exclude older and rarely-used browsers, including Internet Explorer 9, Internet Explorer 10, and Internet Explorer Mobile. This change leads to disabling ES5 builds by default for new projects. If you need to enable ES5 builds and differential loading you have to add the browsers that require it (such as IE or UC Browser) in the <code>.browserslistrc<\/code> file.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Language_Service\"><\/span>Language Service<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Autocompletion is removed from HTML entities, such as <code>&amp;amp;<\/code>, <code>&amp;lt;<\/code>, etc., due to its questionable value and performance cost and to ensure the compatibility with the core functionality of Angular LS.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Compiler_Update\"><\/span>Compiler Update<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>In Angular 10, a compiler interface intended to wrap the actual <code>ngtsc<\/code> compiler is added. The language-service-specific compiler enables multiple type-checking files by using the project interface that creates the necessary ScriptInfos.<\/p>\n<p>Name spans have been added for property reads and method calls handled by the compiler.<\/p>\n<p>Dependency information and ng-content selectors were added to the metadata. The <a class=\"co gj hx hy hz ia\" href=\"https:\/\/github.com\/angular\/angular\/pull\/35695\" target=\"_blank\" rel=\"noopener nofollow noreferrer\">proposed compiler feature<\/a> is going to provide additional useful metadata for tools, like the Angular Language Service, and provide the ability to accommodate suggestions for directives\/components defined in libraries.<\/p>\n<p><a class=\"co gj hx hy hz ia\" href=\"https:\/\/github.com\/angular\/angular\/pull\/36133\" target=\"_blank\" rel=\"noopener nofollow noreferrer\">Propagation<\/a> of the correct value span in an <code>ExpressionBinding<\/code> of a micro syntax expression to\u00a0<code>ParsedProperty<\/code> is enabled, which might propagate the span to the template ASTs (both VE and Ivy).<\/p>\n<h3><span class=\"ez-toc-section\" id=\"ngcc\"><\/span>ngcc<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Angular 10 introduces an implementation of an A-program-based entry-point-finder, designed to process entry points that can only be reached by a program determined by a <code>tsconfig.json<\/code> file. This option can speed up processing when there are many dependencies installed. However, a relatively small portion of the entry points is actually imported into the application.<\/p>\n<p>The size of the entry-point manifest file is reduced. Knowing the base path for package and entry points avoids the need for storing unnecessary empty arrays. Before,\u00a0<code>ngcc<\/code> would have to parse the file of the entry point to compute dependencies, even if the entry point did not need to be processed, which required more time for large node modules.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Localization\"><\/span>Localization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Angular 10 includes support for merging of multiple translation files. Earlier, only one translation file per locale could be loaded, while now users can define numerous files per locale and merge the translations from each one by a message ID. Users must arrange the files in ascending order as the merging is done on a first-come basis. If there are an <code class=\"hm kj kk kl km b\">\"a.xlf\u201d<\/code>,\u00a0<code class=\"hm kj kk kl km b\">\"b.xmb\"<\/code>, and\u00a0<code class=\"hm kj kk kl km b\">\"c.json\"<\/code> files to be merged, the messages from the <code class=\"hm kj kk kl km b\">\"a.xlf\"<\/code>\u00a0file will be considered with greater weight.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Service_Workers\"><\/span>Service Workers<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Previously, when\u00a0<code>Vary<\/code> headers were taken into account while retrieving resources from the cache it entirely prevented the retrieval of cached assets and led to unpredictable behavior due to <code class=\"hm kj kk kl km b\">ServiceWorker<\/code> implementation details and inconsistent implementations in different browsers. With Angular 10, <code class=\"hm kj kk kl km b\">Vary<\/code>\u00a0headers are ignored when retrieving resources from the\u00a0<code class=\"hm kj kk kl km b\">ServiceWorker<\/code> caches. This can result in retrieving resources even when their headers differ. You need to ensure the Angular <code class=\"hm kj kk kl km b\">ServiceWorker<\/code> is configured to avoid caching affected resources, in case your application requires to differentiate its responses based on header requests.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Core\"><\/span>Core<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>In Angular 10 all warnings about unknown elements will be logged as errors, which could stumble tools that expect nothing to be registered via <code>console.error<\/code>.<\/p>\n<p>Previously, View Engine allowed the generic type to be omitted. Now it is made mandatory for <code class=\"hm kj kk kl km b\">ModuleWithProviders<\/code>. A generic type parameter is required for the <code class=\"hm kj kk kl km b\">ModuleWithProviders<\/code> pattern to work with the Ivy compilation and rendering pipeline, so if you are using the pattern without a generic type in your application code, it will be updated when you upgrade to version 10.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Bug_Fixes\"><\/span>Bug Fixes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Several bugs have been fixed in version 10, including:<\/p>\n<ul>\n<li>The compiler avoiding undefined expressions in a holey array.<\/li>\n<li>The core avoiding a migration error while a non-existent symbol is imported.<\/li>\n<li>Proper identification of modules affected by overrides in TestBed.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Converting_pre-Ivy_code\"><\/span>Converting pre-Ivy code<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>All pre-Ivy dependencies from npm should be converted to Ivy dependencies, as Ivy code can only be linked against other Ivy code. Such transformation is required as a precursor to running <code class=\"hm kj kk kl km b\">ngtsc<\/code> on the application. Further compilation and linking operations must be made upon this transformed version of the dependencies.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Deprecations_and_Removals\"><\/span>Deprecations and Removals<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>ESM5 and FESM5 bundles are no longer included in the Angular Package Format. This saves 119MB of download and install time while running <code class=\"hr jd je jf jg b\">yarn<\/code>\u00a0or\u00a0<code class=\"hr jd je jf jg b\">npm install<\/code> for Angular packages and libraries. These distributions had become obsolete as Angular generates ES5 from ES2015, which is the default language level consumed by Angular tooling.<\/p>\n<p>More about deprecations and removals you can find in <a href=\"https:\/\/next.angular.io\/guide\/deprecations\" target=\"_blank\" rel=\"noopener noreferrer\">Angular&#8217;s official documentation<\/a>.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"How_to_update_to_Angular_10\"><\/span>How to update to Angular 10<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To update to Angular 10, you can execute the following command:<\/p>\n<p><code>ng update @angular\/cli @angular\/core<\/code><\/p>\n<p>Note that it is recommended to upgrade one major release at a time.<\/p>\n<p>Comprehensive instructions on your particular case you can obtain from <a href=\"https:\/\/update.angular.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">Angular&#8217;s update tool<\/a>.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"HostArmada_and_Angular_10\"><\/span>HostArmada and Angular 10<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>When our Web Hosting Service Architect and our Innovations Captain were designing the core set of services that HostArmada would offer, they did not miss Angular. From the very beginning, we incorporated the Angular-CLI tool in every service that we offer so in order to use it our customers will have to access the SSH service for their web hosting account and then simply type<code>ng<\/code>to see a complete list of all the available commands related to the Angular-CLI tool. Still, should you face any issue with the usage of the tool, please do not hesitate to contact our <a href=\"https:\/\/hostarmada.com\/technical-support\/\">Technical Support Crew<\/a> and they will do their very best to resolve the issue or answer any Angular related questions you might have.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Stephen Fluin, mentioned that Angular is increasing the investments in working with the community. For three weeks, they have managed to resolve over 700 issues across the framework, tooling, and components. Angular&#8217;s goal is to release two major versions each year to keep everything up-to-date and synchronized with the rest of the JavaScript ecosystem. They have even stated that the release of Angular version 11 is planned for this fall.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Angular is a TypeScript-based open-source framework for building mobile and desktop web applications. It is developed and supported by Google&#8217;s Angular team. A major upgrade of the framework has been released on the 24th of June, only four months after version 9. While this upgrade is not as impactful as the previous one, it affects [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":283,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[14,18,31],"tags":[],"class_list":["post-236","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development","category-open-source","category-technology"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Get to know the new Angular version 10! - HostArmada Blog<\/title>\n<meta name=\"description\" content=\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Get to know the new Angular version 10!\" \/>\n<meta property=\"og:description\" content=\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/\" \/>\n<meta property=\"og:site_name\" content=\"HostArmada Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-07-10T12:35:58+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-07-10T12:36:32+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Sebahat Hadzhi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sebahat Hadzhi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"},\"author\":{\"name\":\"Sebahat Hadzhi\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/person\\\/321a9ca8a79eeda667c44fc5e7390392\"},\"headline\":\"Get to know the new Angular version 10!\",\"datePublished\":\"2020-07-10T12:35:58+00:00\",\"dateModified\":\"2020-07-10T12:36:32+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"},\"wordCount\":1394,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"articleSection\":[\"Development\",\"OpenSource\",\"Technology\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\",\"name\":\"Get to know the new Angular version 10! - HostArmada Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"datePublished\":\"2020-07-10T12:35:58+00:00\",\"dateModified\":\"2020-07-10T12:36:32+00:00\",\"description\":\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"contentUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"width\":1200,\"height\":600,\"caption\":\"Angular 10 Released\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"HostArmada Blog\",\"item\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Get to know the new Angular version 10!\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\",\"name\":\"HostArmada Blog\",\"description\":\"HostArmada official blog. Useful web hosting related articles.\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\",\"name\":\"HostArmada Blog\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/06\\\/logo-png-300x43-1.png\",\"contentUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/06\\\/logo-png-300x43-1.png\",\"width\":300,\"height\":44,\"caption\":\"HostArmada Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/person\\\/321a9ca8a79eeda667c44fc5e7390392\",\"name\":\"Sebahat Hadzhi\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"caption\":\"Sebahat Hadzhi\"},\"description\":\"Sebahat is a young and bright person who had become an invaluable part of our team. Started as a Customer Care Representative who quickly evolved into a Tech-savvy well familiar with every support layer of the company. Driven by the aim to constantly improve our customers\u2019 experience she is committed to enhancing the extraordinary support we deliver.\",\"sameAs\":[\"https:\\\/\\\/hostarmada.com\\\/\"],\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/author\\\/sebahat-hadzi\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Get to know the new Angular version 10! - HostArmada Blog","description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","og_locale":"en_US","og_type":"article","og_title":"Get to know the new Angular version 10!","og_description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","og_url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","og_site_name":"HostArmada Blog","article_published_time":"2020-07-10T12:35:58+00:00","article_modified_time":"2020-07-10T12:36:32+00:00","og_image":[{"width":1200,"height":600,"url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","type":"image\/png"}],"author":"Sebahat Hadzhi","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Sebahat Hadzhi","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#article","isPartOf":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"},"author":{"name":"Sebahat Hadzhi","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/person\/321a9ca8a79eeda667c44fc5e7390392"},"headline":"Get to know the new Angular version 10!","datePublished":"2020-07-10T12:35:58+00:00","dateModified":"2020-07-10T12:36:32+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"},"wordCount":1394,"commentCount":0,"publisher":{"@id":"https:\/\/www.hostarmada.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","articleSection":["Development","OpenSource","Technology"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","name":"Get to know the new Angular version 10! - HostArmada Blog","isPartOf":{"@id":"https:\/\/www.hostarmada.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","datePublished":"2020-07-10T12:35:58+00:00","dateModified":"2020-07-10T12:36:32+00:00","description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","breadcrumb":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage","url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","contentUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","width":1200,"height":600,"caption":"Angular 10 Released"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"HostArmada Blog","item":"https:\/\/www.hostarmada.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Get to know the new Angular version 10!"}]},{"@type":"WebSite","@id":"https:\/\/www.hostarmada.com\/blog\/#website","url":"https:\/\/www.hostarmada.com\/blog\/","name":"HostArmada Blog","description":"HostArmada official blog. Useful web hosting related articles.","publisher":{"@id":"https:\/\/www.hostarmada.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hostarmada.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hostarmada.com\/blog\/#organization","name":"HostArmada Blog","url":"https:\/\/www.hostarmada.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2022\/06\/logo-png-300x43-1.png","contentUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2022\/06\/logo-png-300x43-1.png","width":300,"height":44,"caption":"HostArmada Blog"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/person\/321a9ca8a79eeda667c44fc5e7390392","name":"Sebahat Hadzhi","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","caption":"Sebahat Hadzhi"},"description":"Sebahat is a young and bright person who had become an invaluable part of our team. Started as a Customer Care Representative who quickly evolved into a Tech-savvy well familiar with every support layer of the company. Driven by the aim to constantly improve our customers\u2019 experience she is committed to enhancing the extraordinary support we deliver.","sameAs":["https:\/\/hostarmada.com\/"],"url":"https:\/\/www.hostarmada.com\/blog\/author\/sebahat-hadzi\/"}]}},"_links":{"self":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/comments?post=236"}],"version-history":[{"count":46,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236\/revisions"}],"predecessor-version":[{"id":288,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236\/revisions\/288"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/media\/283"}],"wp:attachment":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/media?parent=236"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/categories?post=236"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/tags?post=236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}