OnPush Detach Change Detection/NgZone Lazy loading modules Improve page load with Angular PWA trackBy for ngFor Pure pipes instead of methods (including async) Cache values from pipes and pure functions Cache HTTP requests better Detach/manual change detection Angular Universal lazy load dynamic component preload strategy over network speed Using Pure Pipes Web Workers
Display dynamic content in angular universal
This guide help Angular Universal, a technology that renders dynamic content on the server in your Angular applications. A normal Angular universal application view source does not display dynamic content in angular universal, rendering pages in the DOM before api call happened in component. Angular Universal executes on the server, generating static application pages that later get bootstrapped on the client. For rendering…
api request is calling twice in angular universal
I faced the problem while loading the app api is calling twice and reloading the app also. I did some changes in some files that are in your angular universal application. Please follow the below step to fix this issue. Step:1 Add {initialNavigation:’enabled’} to RouterModule.forRoot([appRoutes],{initialNavigation:’enabled’}) in app-routing.module.ts file. Step: 2 TransferHttpCacheModule installs an Http connector that avoids duplicate HttpClient GET…
TCS Angular interview questions for experienced 2022
One of my friend who shared with me below interview questions that he faced in TCS Interview. He selected in kolkata location. Process of TCS Online Interview First in call they ask about your current organization and previous all organizations, have any year gap in between work and education, current salary, expected salary, notice period, total years of experienced and…
change route params without reloading browser in angular
I have face this problem when I kept my apps data in route param and that require to change (when user change apps data that present in apps route) route param data when navigate to different route or when click browser back. If you do not change your apps data accordingly that present in apps route then your apps will…
Angular form unsaved changes alert before leaving page | Use of Angular canDeactivate guard
What is CanDeactivate Angular? CanDeactivate is a TypeScript interface that needs to be partially implemented in order to create a router. This guard will be used by the route to determine if the route will be closed. Can be applied to any Angular component using the canDeactivate interface. Use case You can not leave the current page to any route…
error:InvalidValueError: setCenter: not a LatLng or LatLngLiteral with finite coordinates
It may occur for multiple condition I have got this issue from below condition. I face this issue in case mapsAPILoader autocomplete service of agm core map library is not call or subscribe. It occur in my business logic when I set latitude and longitude value for agm marker from api on the page and that was blank value. It’s…
Autofocus angular form on submit
This document has been updated to the latest version of Angular 11 and tested with Angular 10. Content may still apply to all versions of Angular 2+. When working with the required entry in the form sometimes the user may miss the required field. When this happens, users may be confused as to what needs to be resolved in order…
Angular Submit a form programmatically
Need of Angular Submit a form programmatically for different type of design and logic. Like your submit button present out of form block or you have call submit method from ts file. Angular Submit a form programmatically for that mechanism we use here ViewChild template reference with NgForm intance. Follow the bold key points for the main points of this tutorial.…
Server side form validation with Angular and Nodejs
In this tutorial you will learn Angular reactive form validation with interact server side Nodejs express validation. Step by step follow the main bold points that key things and Github project link share in blow. Angular side reactive form validation with server side error response app.module.ts app.component.html app.component.ts Further search for Angular form INTRODUCTION TO FORMS TEMPLATE DRIVEN FORMS ANGULAR…