რა არის standalone კომპონენტები?

Question

Accepted Answer

**Standalone კომპონენტები** (Angular 14+, ახალ ვერსიებში ნაგულისხმევი) საშუალებას აძლევს კომპონენტს, **თავის საკუთარი დამოკიდებულებები პირდაპირ დეკლარირებული იყოს**, `NgModule`-ს კუთვნილების გარეშე. ისინი მნიშვნელოვნად ამცირებენ boilerplate-ს და ახლა რეკომენდირებული გზაა Angular აპ-ის აშენებისთვის. ## Standalone კომპონენტი ```ts import { Component } from "@angular/core"; import { CommonModule } from "@angular/common"; import { RouterLink } from "@angular/router"; @Component({ selector: "app-user-list", standalone: true, // ← no NgModule needed imports: [CommonModule, RouterLink], // ← declare dependencies HERE, on the component template: ` {{ u.name }} `, }) export class UserListComponent { users = []; } ``` კომპონენტი იმპორტირებს ზუსტად იმას, რაც მისი template იყენებს (`CommonModule` `*ngFor`-სთვის, `RouterLink` ლინკებისთვის) — მისი დამოკიდებულებები აშკარა და თანამდებელი განთავსებით არის, ვიდრე ცალკე NgModule-ში დეკლარირებული. ## კონტრასტი NgModules-თან ```text NgModule approach: Standalone approach: ────────────────────────────────────────────────────────────── @NgModule({ declarations:[Comp], @Component({ standalone: true, imports:[CommonModule] }) imports:[CommonModule], ... }) → extra file, indirection → everything in one place ``` ## Standalone აპ-ის bootstrap-ი (AppModule გარეშე) ```ts 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 ], }); ``` Standalone აპ-ები ცვლიან ძირეული `AppModule`-ს `bootstrapApplication` და **`provideX`** ფუნქციებით — უფრო სუფთა, ფუნქციაზე დაფუძნებული კონფიგურაცია. ## უპირატესობები ```text ✓ 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 ``` ## რატომ არის ეს მნიშვნელოვანი Standalone კომპონენტები არის **Angular-ის თანამედროვე მიმართულება** — ჩარჩო ახლა ნაგულისხმევად scaffolds standalone და უზრუნველყოფს `provideX` ფუნქციებს მოდულების გარეშე ფიჩარების კონფიგურირებისთვის. ისინი აშორებენ დიდხანს გრძელდებულ NgModule დამატებული ხარჯების, აშკარა და ლოკალურ დამოკიდებულებებს, და აამარტივებენ lazy loading-ს და ზოგად გონებრივ მოდელს. Standalone-ის გაგება (და `bootstrapApplication`/`provideRouter`/`provideHttpClient` დაყენება) აუცილებელია მიმდინარე Angular-ში მუშაობისთვის, მაშინ როდესაც NgModule-ის ცოდნა საჭიროა legacy კოდისთვის.