This blog is to discuss major new features of Angular 14.<\/p>\n
Angular 14, the latest version of the Google-developed, TypeScript-based web application framework, has arrived, featuring typed forms and a developer preview of standalone components.<\/p>\n
To upgrade\u00a0 from Angular 13 to Angular 14 use the below upgrade command .<\/p>\n
ng update @angular\/core@14 @angular\/cli@14<\/p>\n
Standalone\u00a0 Components in Angular 14\u00a0<\/strong><\/p>\n For standalone components,\u00a0 there is no\u00a0 need to mention the component name in the declaration section of app.modules .ts file. The component name can be mentioned in the imports section.\u00a0 In Angular 14\u00a0 we can create\u00a0 standalone directives and pipes.<\/p>\n In the root folder of the application\u00a0 execute the below command\u00a0 to create the standalone component<\/p>\n ng\u00a0 g c login –standalone<\/p>\n The above command will\u00a0 create the standalone component. A login component will be auto-generated.<\/p>\n Add loginComponent in the import section of appmodule.ts. There is no need to add it to the declaration section.\u00a0 If\u00a0 you want to add loginComponent while bootstrapping the application, you can add it in main.ts file.<\/p>\n Reactive Forms<\/strong>:<\/p>\n Typed forms ensure that the values we enter in the form of controls, groups, and arrays are type-safe across the entire API surface.<\/p>\n Route Title<\/strong><\/p>\n The developer can set title of the route\u00a0 in-app-routing, module.ts file<\/p>\n when the user has visited the login route, the title of route is displayed in the browser tab.<\/p>\n Conclusion<\/strong><\/p>\n With the release of Angular 14, Google has provided lot of new features which are developer\u00a0 friendly and improve the performance of the application.<\/p>\n <\/p>\n <\/p>\n <\/p>\n <\/p>\n","protected":false},"excerpt":{"rendered":" This blog is to discuss major new features of Angular 14. Angular 14, the […]<\/p>\n","protected":false},"author":248,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[2],"tags":[],"coauthors":[88],"class_list":["post-659","post","type-post","status-publish","format-standard","hentry","category-web-ui-ux"],"acf":[],"_links":{"self":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/users\/248"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/comments?post=659"}],"version-history":[{"count":9,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/659\/revisions"}],"predecessor-version":[{"id":704,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/659\/revisions\/704"}],"wp:attachment":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/media?parent=659"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/categories?post=659"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/tags?post=659"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/coauthors?post=659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}