स्टॅन्डअलोन घटक (Angular 14+, नवीन आवृत्त्यांमध्ये डिफॉल्ट) एक घटकाला त्याचे स्वतःचे अवलंबन थेट घोषित करण्यास अनुमती देतात, NgModule ला संबंधित असण्याची गरज न पडता. ते बॉयलरप्लेट को नाटकीयरित्या कमी करतात आणि आता Angular अॅप्लिकेशन तयार करण्याचा सुप्रस्थापित मार्ग आहे.
{ } ;
{ } ;
{ } ;
({
: ,
: ,
: [, ],
: ,
})
{
users = [];
}
घटक त्याचे टेम्प्लेट जे वापरते (*ngFor साठी CommonModule, लिंकसाठी RouterLink) ते तंतोतंत आयात करतो — त्याचे अवलंबन स्पष्ट आणि सहअवस्थित आहे, अलग NgModule मध्ये घोषित केल्याऐवजी.
NgModule approach: Standalone approach:
──────────────────────────────────────────────────────────────
@NgModule({ declarations:[Comp], @Component({ standalone: true,
imports:[CommonModule] }) imports:[CommonModule], ... })
→ extra file, indirection → everything in one place
import { bootstrapApplication } from "@angular/platform-browser";
import { provideRouter } from "@angular/router";
import { provideHttpClient } from "@angular/common/http";
bootstrapApplication(AppComponent, {
providers: [
provideRouter(routes), // configure router functionally
provideHttpClient(), // HttpClient without HttpClientModule
],
});
स्टॅन्डअलोन अॅप्लिकेशन रूट AppModule ला bootstrapApplication आणि provideX फंक्शन्सने बदलतात — एक स्वच्छ, फंक्शन-आधारित कॉन्फिगरेशन.
✓ Less boilerplate — no NgModule files to maintain
✓ Explicit dependencies — see exactly what a component uses
✓ Easier lazy loading — loadComponent() directly
✓ Simpler mental model — components are self-contained units
✓ Better tree-shaking potential
स्टॅन्डअलोन घटक Angular ची आधुनिक दिशा आहेत — फ्रेमवर्क आता डिफॉल्टने स्टॅन्डअलोन स्कॅफोल्ड करतो आणि मॉड्यूल्सशिवाय वैशिष्ट्ये कॉन्फिगर करण्यासाठी provideX फंक्शन्स प्रदान करतो.
ते दीर्घकाळीन NgModule ओव्हरहेड काढून टाकतात, अवलंबन स्पष्ट आणि स्थानिक करतात, आणि मंद लोडिंग आणि संपूर्ण मानसिक मॉडेल सरल करतात.
स्टॅन्डअलोन समजून घेणे (आणि bootstrapApplication/provideRouter/provideHttpClient सेटअप) वर्तमान Angular मध्ये कार्य करण्यासाठी आवश्यक आहे, तर NgModule ज्ञान लिगेसी कोडसाठी आवश्यक राहतो.