NEW TECH UPDATES

  forRoot   /   forChild   is a pattern for singleton services that most of us know from routing. Routing is actually the main use case for it and as it is not commonly used outside of it, I wouldn’t be surprised if most Angular developers haven’t given it a second thought. However, as the official Angular documentation puts it: “Understanding how  forRoot()  works to make sure a service is a singleton will inform your development at a deeper level.” So let’s go. Providers & Injectors Angular comes with a dependency injection (DI) mechanism. When a component depends on a service, you don’t manually create an instance of the service. You  inject  the service and the dependency injection system takes care of providing an instance. import { Component, OnInit } from '@angular/core'; import { TestService } from 'src/app/services/test.service'; @Component({ selector: 'app-test', templateUrl: './test.component.html', styleUrls: ['./test.compon...

  When we develop a simple application or complex enterprise  application  using any technology, The end-user always needs the report data in an  Excel  file. Why because most people rely on excel file. I worked with various  Angular  Enterprise  applications . In all applications, the customer asked us to give a  downloadable excel  file using various filters. In this tutorial, you will learn, how to download an excel file using  Angular . I am going to show a demo of excel file  download  using  ExcelJS  and File Saver plugin. If you are an Angular developer and looking for export data to excel, then this post will help you more. We will see them one by one. Step 1. Create New Angular Project Create a new Angular project using the below command. ng new angular-excel-example Once the initial setup is done, then open the project folder using the VS code editor. Step 2. Install ExcelJS Plugin ExcelJS plugin is use...

  Most of the web applications are written with SPA frameworks such as Angular, React, Vue.js, etc. The problem with these SPAs is that the single page is loaded in the browser once and then the framework will take care of all the routing among pages and gives the impression to the user that it is a multi-page application. When you refresh your page in the browser that single page called index.html is reloaded and you will lose the entire state of the application. There are ways you can retain the state of the application in those cases. One way is to make the necessary API calls to the backend server and retrieve the data again. This works well if you have a small number of calls but, it strains the server. Another way is to design your application in such a way that when you put the data in the local storage and retain it as soon as the page is loaded in the browser. In this post, we will see how we can retain the state of the application in Angular apps with the help of NGRX sto...