angular
February 2

Использование inject() и модификаторов для DI в Angular

Начиная с Angular 14, появился новый способ внедрения зависимостей через функцию inject(), которая позволяет получать сервисы без использования конструктора. Это особенно полезно в Standalone Components и ситуациях, когда хочется избавиться от лишних зависимостей в конструкторе.

Как использовать inject()?

Вместо того чтобы объявлять зависимость в конструкторе, теперь можно получить её так:

import { inject } from '@angular/core';
import { MyService } from './my-service';

export class ExampleComponent {
  private myService = inject(MyService);

  constructor() {
    this.myService.log();
  }
}

Модификаторы для inject()

В inject() можно передавать специальные параметры, позволяющие контролировать область видимости зависимости.

1. Эквивалент @Self(){ self: true }

Ищет зависимость только в текущем компоненте.

const myService = inject(MyService, { self: true });

Если сервис не зарегистрирован в текущем компоненте, Angular выдаст ошибку.

2. Эквивалент @SkipSelf(){ skipSelf: true }

Пропускает текущий уровень DI и ищет зависимость в родительском инжекторе.

const myService = inject(MyService, { skipSelf: true });

Используется, когда сервис определён только в родительском компоненте или модуле.

3. Эквивалент @Optional(){ optional: true }

Делает зависимость необязательной — если сервис отсутствует, будет null, а не ошибка.

const myService = inject(MyService, { optional: true });

Полезно, если сервис может отсутствовать (например, он не всегда используется в компоненте).