Аналог React useEffect в Angular?

В Angular нет прямого аналога для хука useEffect из React, но можно добиться подобного функционала, комбинируя несколько механизмов, доступных в Angular.

Хук useEffect в React используется для выполнения побочных эффектов (например, вызов API, изменение DOM) после рендеринга компонента. В Angular подобная функциональность может быть реализована с использованием жизненного цикла компонентов и сервисов.

В Angular жизненный цикл компонента представлен через несколько методов, наиболее близким к useEffect будет метод ngOnChanges, который вызывается каждый раз, когда происходят изменения во входных данных компонента. Это можно использовать для выполнения эффектов при изменении определенных свойств компонента. Например:

import { Component, OnChanges, SimpleChanges } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnChanges {
  ngOnChanges(changes: SimpleChanges): void {
    if (changes.someInput) {
      // выполнение побочного эффекта при изменении свойства someInput
      // код здесь
    }
  }
}

Если нужно эмулировать поведение useEffect при инициализации компонента, можно использовать метод ngOnInit, который вызывается после того, как Angular инициализировал компонент и загрузил его шаблон. Например:

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

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnInit {
  ngOnInit(): void {
    // выполнение побочного эффекта при инициализации компонента
    // код здесь
  }
}

Кроме того, для выполнения побочных эффектов в Angular можно использовать сервисы. Создайте сервис, в котором определите методы для выполнения нужных действий, и затем в компоненте внедрите этот сервис и вызывайте его методы при необходимости. Например:

import { Component, OnInit } from '@angular/core';
import { MyService } from './my-service.service';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnInit {
  constructor(private myService: MyService) {}

  ngOnInit(): void {
    this.myService.doSomething();
    // выполнение побочного эффекта при инициализации компонента с использованием сервиса
  }
}

В итоге, хотя в Angular нет прямого аналога для useEffect из React, с помощью сочетания методов жизненного цикла компонентов, сервисов и обработчиков изменений свойств компонента можно достичь похожего функционала.