1000 Angular Facts Q-NO (56-70) Part-5

           

1000 Angular Facts Part-5

56.Change Detection in Angular detects any changes and based on the changes it will update the HTML DOM.

In change detection Angular runs over the bindings, evaluates expressions and compares them to the previous values and updates the DOM when required.

By default the change detection goes through every node of the tree to see if it changed, and it does it on every browser event

57. There are two different Change Detection strategies are supported.

•     ChangeDetectionStrategy.Default.
•     ChangeDetectionStrategy.OnPush.

58. Every Angular application must have one parent module which is called app module and it contains the list of different items which are listed below.
• Components
• Service providers
• Custom modules
• Routing modules
• Pipes

59. PrimeNg is a collection of reach UI components for Angular.

https://www.primefaces.org/primeng/

PrimeNG is available at npm, if you have an existing application run the following command to download it to your project.
npm install primeng --save
npm install primeicons --save

60. To Add ngx-bootstrap and Bootstrap :

step-1:
install ngx-bootstrap and Bootstrap
npm install ngx-bootstrap bootstrap --save

step-2: 
add styles to angular.json:

"styles": [
   "../node_modules/bootstrap/dist/css/bootstrap.min.css",
   "styles.css"
],

61. An impure pipe is called for every change detection cycle no matter whether the value or parameters changes.

 i.e, An impure pipe is calls on every keystroke or mouse-move.

62. Class decorator: A decorator that appears immediately before a class definition, which declares the class to be of the given type and provides metadata suitable to the type.

The following decorators can declare Angular class types:
@Component()
@Directive()
@Pipe()
@Injectable()
@NgModule()


63. Differential loading: is build technique that creates two bundles for an application. Smaller bundle is for modern browsers and larger bundle allows the application to run correctly in older browsers (i.e IE11) that do not support all modern browser APIs.

64. Dynamic component loading: A technique for adding a component to the DOM at run time. Requires that you exclude the component from compilation and then connect it to Angular's change-detection and event-handling framework when you add it to the DOM.

65. @NgModule: metadata is used to tell the Angular compiler what components to be compiled for this module and how to link this module with other modules.

@NgModule({
  declarations: [
    AppComponent,
    Demo2Component 
  ],
  imports: [
    BrowserModule,
    FormsModule,   
    AppRoutingModule
  ],
  providers: [
    { provide: HTTP_INTERCEPTORS, useClass: MyInterceptor, multi: true }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

66. What are the types of feature modules?

Below are the five categories of feature modules:

Domain: Deliver a user experience dedicated to a particular application domain(For example, place an order, registration etc)
Routed: Domain feature modules whose top components are the targets of router navigation routes.
Routing: Provides routing configuration for another module.
Service: Provides utility services such as data access and messaging(For example, HttpClientModule)
Widget: It makes components, directives, and pipes available to external modules'

67.How to change default port number other than 4200?

Ans. If you have created new Angular app and server the app using ng serve, then our app will be executed
on URL localhost:4200, but we can change it using additional flag along with ng serve which is –port.
ng serve --port 4300

68.How to change the default protocol other than HTTP?

Ans. By default, the Angular application works on HTTP protocol which is not secure to use, so angular provide provision to change it to HTTPS which is an encrypted connection between client and server.

We can use additional flag along with command ng serve which is –ssl and we can enable it using Boolean value
true/false.
ng serve --ssl=true
Now we will be able to run our Angular app using HTTPS securely, by default –ssl value is false.

69.DatePipe: Formats a date value according to locale rules.

{{ value_expression | date [ : format [ : timezone [ : locale ] ] ] }}
{{ dateObject | date }}               // output is 'Jun 15, 2015'
{{ dateObject | date:'medium' }}      // output is 'Jun 15, 2015, 9:43:11 PM'
{{ dateObject | date:'shortTime' }}   // output is '9:43 PM'


70.These are the various NgModule metadata properties:
• Declaration
• Imports
• Exports
• Providers
• Bootstrap
• entryComponent
• Id
• Jit
• Schemas

Thank You

[dotnetfacts.com]

Also Read.......!!

Angular Facts Part-1

Angular Facts Part-2