foundation

Components

Стройте UI через standalone components, templates, inputs, outputs, content projection, lifecycle hooks и change detection.

Компоненты Angular объединяют class, template и styles. Standalone импортируют зависимости без NgModule. `@Input` / `@Output` — контракт с родителем; content projection (`ng-content`) — layout shells.

Change detection: по умолчанию проверяются все bindings; `OnPush` — при смене inputs или событиях из компонента — важно для performance на интервью.

					@Component({
  selector: 'app-user',
  standalone: true,
  template: `<p>{{ user().name }}</p>`,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class UserComponent {
  user = input.required<User>();
}

На интервью: порядок lifecycle hooks, signal inputs, smart vs presentational.

Типовые ошибки: мутация @Input, тяжёлая работа в constructor, default CD на больших деревьях.

Компромисс: выигрыш OnPush в performance против строгой иммутабельности inputs и event-driven обновлений.

Чеклист:

OnPush для списков.
Inputs/outputs как явный API.
ng-content для гибких shells.
Тонкий template; логика в class или service.