Skip to main content

Posts

Showing posts from February, 2020

What is Lazy Loading in Angular

What is Lazy Loading in Angular:- Lazy loading is a useful concept in angular. because it is on-demand work. it is a process of loading NgModules only when you navigate to the route. If you have a lot of application with numerous routes, you should consider using this concept it will keep the initial bundle size is smaller and as a result, the application can be loaded much faster. How to Create Lazyloading Module with Routing:- Next, we need to create our feature with the component to navigate to. So we create a new module, execute the following command. ng generate module admin --route admin --module app.module so open your terminal and the command is Run. you can see a new module called admin and the route path to load the home component. In addition, it will add the homepage route inside the Routes array inside this module as the --module options. app-routing.module.ts Here is the result of app-routing.module.ts file. import { NgModule } from &

What is pipe and how to use

What is pipe and how to use:- angular pipes can be used to transform data into the desired output .  The type takes in a data incident to transform data into a different output. using the pipe operator(|), we can apply pipes features To any of the property in our angular project. Pipes (|) in angular are used to transform the data before displaying it in a browser. angular provides a lot of built-in pipes translate the data before displaying it into the browser and as we know, angular lets us extend its feature, we can even create a custom pipe in angular. Syntaxes:- {{‘Test’ | uppercase}} => TEST Basic Pipes:- Most of the pipes provided by Angular 8 will be familiar with us if we already worked in the previous Angular version. Currency Date Uppercase Lowercase JSON Decimal Percent Async How to use Pipe:- app.component.ts import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-root',

Introduction to services and dependency injection

Introduction to services and dependency injection service is a code that are used to perform a specific task, a service can contain a value or function or combination of both. Service is injected into the application using dependency injection mechanism. Service provides its data and methods other needs components. How to create a service:- you can easily generate service. Open your terminal and type: ng generate service auth Import the Injectable Member:-At the top of your new service file, add: import { Injectable }from'@angular/core'; Include it through dependency injection:- In the constructor argument of the component class, we include it through dependency injection: constructor( private afAuth: AngularFireAuth, private router: Router, private afs: AngularFirestore ) {} Create a Method and use another component:-So, guys, you can finally create the method and use need components. So let’s go and see the little example.