Angular architecture

Angular Architecture

Angular architecture is split into 8 major types. Let discuss this topic.

1)  Modules

2)  Data Binding

3)  Component 

4)  Template

5)  Data service

6)  Metadata

7)  Dependency Injection

Modules

Modules are playing a major part in the angular app. This will place the various related unit on a single page. This will be used to declare all the services, components and plugins.

@ngModules

This decorator will be used as a metadata object. This will help to compile components and used to create a runtime injector.

Error Handler

This will easily identify the errors that will catch from the app. It will be separated into two modules, try and catch. try will lead to getting the errors from the app and catch will show the exceptions.

import { NgModule, ErrorHandler } from '@angular/core';

@NgModule({

  declarations: [

  ],

  imports: [

  ],

  bootstrap: [],

  entryComponents: [

  ],

  providers: [

    {provide: ErrorHandler, useClass: IonicErrorHandler}

  ]

})

export class AppModule {}

Data Binding

This will be used to bind the data from the user to the app. Basically, it will separate single and two-way binding.

The single binding will be only shown the values that come from the typescript.

{{object name. value}}

The two-way binding will show the values and also sent the  value to the typescript page

<input type = 'text' [(ngModel)]='object value'>

Component

This will be used to create the properties and create the HTML page, and create a typescript page.

Html page to display the content to the end-user.

Template

This will display the Html content by the end-user. Basically, it will update the version of Html 5. Also, it will content of the user interface.

MetaData

It was basically Data about the data. It will be used as the content of the angular data.

Services

This will be used to mostly used on angular components. this will be used as a reusable code. so we can use it in any component.