Angular 10 Modules

Angular 10 Modules

In this post we will give you information about Angular 10 Modules. Hear we will give you detail about Angular 10 ModulesAnd how to use it also give you demo for it if it is necessary.

Let’s now learn abour Angular 10 modules by example.

Angular projects adhere to a modular and component-based architecture.

According to Wikipedia:

Modular programming is a software design technique that emphasizes separating the functionality of a program into independent, interchangeable modules, such that each contains everything necessary to execute only one aspect of the desired functionality.

How to Create Angular Modules

Angular makes it easy to create modules by providing *[NgModules**](*

A NgModule is a TypeScript class decorated with the @NgModule decorator which takes a few metadata that does the following:

  • Declares which components, directives, and pipes belong to the module.
  • Makes some of those components, directives, and pipes public so that other module’s component templates can use them.
  • Imports other modules with the components, directives, and pipes that components in the current module need.
  • Provides services that the other application components can use.

Please note that Angular modules are not JavaScript modules.

Every Angular app has at least one module, conventionally called the root module. This is the module that gets bootstrapped for running the application.

See also  PHP Codeigniter 3 - Basic CRUD Operation with MySQL Database with example

Angular 10 Modules by Example

Head over to your Angular 10 project in the Stackblitz IDE. Open the src/app/app.module.ts file, you should see the following code:

import { NgModule } from '@angular/core';import { BrowserModule } from '@angular/platform-browser';import { FormsModule } from '@angular/forms';import { AppComponent } from './app.component';import { HelloComponent } from './hello.component';@NgModule({imports: [ BrowserModule, FormsModule ],declarations: [ AppComponent, HelloComponent ],bootstrap: [ AppComponent ]})export class AppModule { }

At the top, we have some import statements. NgModule belongs to the @angular/core package.

After the imports, we configure the module by decorating the AppModule class with @[NgModule]( and stating what components and directives belong to it (In the declarations array) as well as which other modules it uses (In the imports array). For more information on the structure of an @[NgModule](, you can read Bootstrapping from the official Angular guide.

See also  How to uninstall deno from your system


There is more that you should know about modules but let’s leave that to after you build your first app.

Hope this code and post will helped you for implement Angular 10 Modules. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

See also  Ionic 4/Angular - Create, Generate and Add Pages
We're accepting well-written guest posts and this is a great opportunity to collaborate : Contact US