HTTP INTERCEPTORS

The Angular HTTP interceptors sit between our application and the
backend. When the application makes a request, the interceptor catches the
request (HttpRequest) before it is sent to the backend. By Intercepting
requests, we will get access to request headers and the body. This enables
us to transform the request before sending it to the Server. 

nneed to create an injectable service, which implements

1. import { Injectable } from '@angular/core'  
2. import { HttpInterceptor, HttpHandler, HttpRequest, HttpEv
ent, HttpResponse } from '@angular/common/http';  
3. import { Observable } from 'rxjs/Observable';  
4. import 'rxjs/add/operator/do';  
5. @Injectable()  
6. export class ResponseInterceptor implements HttpIntercepto
r {  
7.     intercept(req: HttpRequest<any>, next: HttpHandler): O
bservable<HttpEvent<any>> {  
8.   
9.        console.log("Before sending data")  
10.         console.log(req);  
11.         return next.handle(req)  
12.             .retry(3)  
13.             .map(resp => {  
14.                 if (resp instanceof HttpResponse) {  
15.                    console.log('Response is ::');  
16.                     console.log(resp.body)  
17.                 }  
18.                 return resp;  
19.             }).catch(err => {  
20.                 console.log(err);  
21.                 if (err instanceof HttpResponse)  
22.  {  
23.                     console.log(err.status);  
24.                     console.log(err.body);  
25.                 }  
26.   
27.                 return Observable.of(err);  
28.             });
 @Injectable() export class AppHttpInterceptor implements HttpInterceptor {

providers: [
    {
        provide: HTTP_INTERCEPTORS,
        useClass: AppHttpInterceptor,
        multi: true
    }
],

AOT VS JIT
 
The Angular compiler converts our applications code (HTML and TypeScript)
into JavaScript code before browser downloads and runs that code.

JIT (Just-in-Time) -
1.      JIT compiles our app in the browser at run-time.
2.      Compiles before running
3.      Each file compiled separately
4.      No need to build after changing our app code and it automatically reflects the changes
in your browser page
5.      Highly secure
6.      Very suitable for local development

AOT (Ahead-of-Time) -
1.      AOT compiles our app code at build time.
2.      Compiles while running
3.      Compiled by the machine itself, via the command line (Faster)
4.      All code compiled together, inlining HTML/CSS in the scripts
5.      Highly secure
6.      Very suitable for production builds

. What are decorators in Angular? 

Decorators are a design pattern or functions that define how Angular features work.
They are used to make prior modifications to a class, service, or filter. Angular
supports four types of decorators, they are:

1. Class Decorators
 2. Property Decorators

3. Method Decorators

4. Parameter Decorators

16. What are Pure Pipes? 

Pure Pipes
A “pure” pipe (Which I have to say, I don’t like the naming.. It’s not that intuitive…), is
an Angular Pipe that only runs when the underlying variable value changes.

A pure pipe will only trigger change detection when one of its input values changes (e.g. you receive data
from a backend endpoint (in a component) and the component’s view is updated thereby passing a new
value to the pipe.

An impure pipe will run on every change detection cycle (click, scroll, etc). They are not great
performance-wise but sometimes necessary.

I use an impure pipe to display error messaging since mutation of the error object on the form control class
does not trigger change detection (the object reference stays the same even if the value of one of its keys
changes).

17. What are Impure Pipes?

For every change detection cycle in Angular, an impure pipe is called regardless of
the change in the input fields. Multiple pipe instances are created for these pipes.
Inputs passed to these pipes can be mutable. 

By default, all pipes are pure. However, you can specify impure pipes using the pure
property, as shown below.

@Pipe({

  name: 'demopipe',

  pure : true/false 
})

export class DemopipePipe implements PipeTransform {

FILTERS

 What are filters in Angular? Name a few of them.

Filters are used to format an expression and present it to the user. They can be used
in view templates, controllers, or services. Some inbuilt filters are as follows. 

 date - Format a date to a specified format.

 filter - Select a subset of items from an array.

 Json - Format an object to a JSON string.

 limitTo -  Limits an array/string, into a specified number of

 lowercase - Format a string to lowercase.

What is lazy loading in Angular and how do you apply it?