Angular অ্যাপ্লিকেশনে বিভিন্ন ধরনের কার্যকারিতা যোগ করতে প্রয়োজনীয় মডিউল ইমপোর্ট করা হয়। Angular একটি মডিউলার আর্কিটেকচার অনুসরণ করে, যেখানে প্রতিটি কম্পোনেন্ট, সার্ভিস, ডিরেকটিভ, বা পাইপ একটি নির্দিষ্ট মডিউলের অংশ হিসেবে কাজ করে। মডিউল ইমপোর্ট করার মাধ্যমে আপনি Angular এর বিভিন্ন ফিচার ব্যবহার করতে সক্ষম হন।
এখানে Angular অ্যাপ্লিকেশনে প্রয়োজনীয় মডিউল ইমপোর্ট করার প্রক্রিয়া বিস্তারিতভাবে আলোচনা করা হলো।
প্রথমে, আপনি যে মডিউলটি ব্যবহার করতে চান, সেটি আপনার প্রজেক্টে তৈরি থাকতে হবে। মডিউল তৈরি করতে Angular CLI এর ng generate module
কমান্ডটি ব্যবহার করুন:
ng generate module module-name
এটি একটি নতুন মডিউল তৈরি করবে এবং সেই মডিউলটির জন্য একটি TypeScript ফাইল তৈরি করবে।
আপনার অ্যাপ্লিকেশনের যে অংশে মডিউলটি ব্যবহার করতে চান, সেখানে ওই মডিউলটি ইমপোর্ট করতে হবে। সাধারণত, এটি app.module.ts
ফাইলে করা হয়, যা মূল মডিউল হিসেবে কাজ করে।
উদাহরণস্বরূপ, যদি আপনি FormsModule
বা HttpClientModule
ব্যবহার করতে চান, তাহলে এগুলি app.module.ts ফাইলে ইমপোর্ট করতে হবে।
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms'; // Importing FormsModule
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule // Adding FormsModule to imports array
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http'; // Importing HttpClientModule
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpClientModule // Adding HttpClientModule to imports array
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router'; // Importing RouterModule
import { AppComponent } from './app.component';
const routes: Routes = [
{ path: '', component: AppComponent }
];
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
RouterModule.forRoot(routes) // Adding RouterModule with routes to imports array
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
আপনি যদি বিভিন্ন মডিউল ব্যবহার করতে চান, তবে সেগুলোরও ইমপোর্ট করতে হবে। উদাহরণস্বরূপ:
CommonModule
ব্যবহার করতে হবে।providers
এবং declarations
অংশে যোগ করাকোনও মডিউল যদি নির্দিষ্ট সার্ভিস, ডিরেকটিভ বা পাইপ অন্তর্ভুক্ত করে, তবে আপনি সেগুলোকেও উপযুক্তভাবে providers
এবং declarations
অংশে যুক্ত করবেন। উদাহরণস্বরূপ:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule
],
providers: [], // Providers can be added here for services
bootstrap: [AppComponent]
})
export class AppModule { }
Angular অ্যাপ্লিকেশনে প্রয়োজনীয় মডিউল ইমপোর্ট করা খুবই গুরুত্বপূর্ণ, কারণ এটি অ্যাপ্লিকেশনের বিভিন্ন কার্যকারিতা এবং ফিচারকে যুক্ত করে। আপনি app.module.ts
ফাইলে import
স্টেটমেন্ট ব্যবহার করে বিভিন্ন মডিউল, ডিরেকটিভ এবং সার্ভিস ইমপোর্ট করতে পারবেন। মডিউলগুলো ইমপোর্ট করার মাধ্যমে আপনি আপনার অ্যাপ্লিকেশনের কার্যক্ষমতা বৃদ্ধি করতে পারেন।
Read more