การเริ่มต้นแอปแบบสแตนด์อโลน

การเริ่มต้นแอปแบบ Standalone

จุดเริ่มต้น: main.ts

import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent);

bootstrapApplication มาจากที่ใด

คอมโพเนนต์ราก

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: '<h1>My App</h1>'
})
export class AppComponent {}

การจัดเตรียมบริการของแอปพลิเคชัน

bootstrapApplication(AppComponent, {
  providers: []
});

การจัดเตรียมเราเตอร์

import { provideRouter } from '@angular/router';
import { routes } from './app.routes';

bootstrapApplication(AppComponent, {
  providers: [provideRouter(routes)]
});

การจัดเตรียม HttpClient

import { provideHttpClient } from '@angular/common/http';

bootstrapApplication(AppComponent, {
  providers: [provideHttpClient()]
});

การรวมผู้ให้บริการ

bootstrapApplication(AppComponent, {
  providers: [
    provideRouter(routes),
    provideHttpClient()
  ]
});

รูปแบบ app.config.ts

import { ApplicationConfig } from '@angular/core';
import { provideRouter } from '@angular/router';
import { routes } from './app.routes';

export const appConfig: ApplicationConfig = {
  providers: [provideRouter(routes)]
};

การใช้ app.config ใน main.ts

import { bootstrapApplication } from '@angular/platform-browser';
import { appConfig } from './app/app.config';
import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent, appConfig);

การจัดการข้อผิดพลาด

bootstrapApplication(AppComponent, appConfig)
  .catch(err => console.error(err));

ตรวจสอบสั้น ๆ: การเริ่มต้นแอป

สรุป: การเริ่มต้นแอป