Назовите ключевые компоненты Angular?

В Angular существует несколько ключевых компонентов, которые играют важную роль в разработке приложений. Давайте рассмотрим некоторые из них:

Компоненты (Components):
- Компоненты являются основными строительными блоками Angular приложений.
- Каждый компонент представляет собой независимую часть пользовательского интерфейса, которая может иметь свою логику и свои данные.
- Компоненты используются для организации и отображения содержимого на странице.
- Они состоят из шаблона (template), класса компонента (component class) и метаданных (metadata), которые описывают компонент.
- Пример компонента:

import { Component } from '@angular/core'

@Component({
	selector: 'app-example',
	template: '<h1>Hello, World!</h1>'
})
export class ExampleComponent {}

Директивы (Directives):
- Директивы позволяют изменять поведение и внешний вид элементов DOM.
- В Angular есть два типа директив: структурные и атрибутные.
- Структурные директивы изменяют структуру DOM, добавляя или удаляя элементы.
- Атрибутные директивы изменяют внешний вид элементов, добавляя или изменяя атрибуты.
- Angular поставляется со встроенными директивами, такими как ngIf, ngFor, ngSwitch и другими.
- Пример использования директивы:

import { Component } from '@angular/core'

@Component({
	selector: 'app-example',
	template: `
		<div *ngIf="showMessage">
			<h1>Hello, World!</h1>
		</div>
	`
})
export class ExampleComponent {
	showMessage: boolean = true
}

Сервисы (Services):
- Сервисы используются для организации и предоставления общей функциональности и данных в приложении.
- Они предоставляют независимые от компонентов службы, такие как доступ к данным, обработка HTTP запросов, аутентификация, логика бизнес-процессов и другие.
- Сервисы можно внедрять в компоненты или другие сервисы с помощью механизма внедрения зависимостей (Dependency Injection).
- Сервисы являются одиночками (Singletons), что означает, что для всего приложения существует только один экземпляр сервиса.
- Пример сервиса:

import { Injectable } from '@angular/core'

@Injectable()
export class ExampleService {
	getData(): string {
		return 'Hello, World!'
	}
}

Модули (Modules):
- Модули служат для организации и группировки компонентов, директив, сервисов и других функциональных частей приложения.
- Они определяют контекст выполнения для компонентов и обеспечивают логическую разделенность приложения.
- Angular приложение состоит из корневого модуля (AppModule) и других модулей, которые могут быть загружены лениво.
- Модули импортируются в другие модули с помощью декоратора @NgModule.
- Пример модуля:

import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { AppComponent } from './app.component'

@NgModule({
	imports: [BrowserModule],
	declarations: [AppComponent],
	bootstrap: [AppComponent]
})
export class AppModule {}

Это лишь некоторые из ключевых компонентов Angular. Каждый из них имеет свою роль и способствует разработке мощных и масштабируемых веб-приложений.

Little Angular programmer's library

Назовите ключевые компоненты Angular?