@angular/core

PendingTasks

Class

Service that keeps track of pending tasks contributing to the stableness of Angular application. While several existing Angular services (ex.: HttpClient) will internally manage tasks influencing stability, this API gives control over stability to library and application developers for specific cases not covered by Angular internals.

API

  
    class PendingTasks {}

add

() => void

Adds a new task that should block application's stability.

@returns() => void

run

Promise<T>

Runs an asynchronous function and blocks the application's stability until the function completes.

          pendingTasks.run(async () => {  const userData = await fetch('/api/user');  this.userData.set(userData);});

Application stability is at least delayed until the next tick after the run method resolves so it is safe to make additional updates to application state that would require UI synchronization:

          const userData = await pendingTasks.run(() => fetch('/api/user'));this.userData.set(userData);

@paramfn() => Promise<T>

The asynchronous function to execute

@returnsPromise<T>

Description

The concept of stability comes into play in several important scenarios:

SSR process needs to wait for the application stability before serializing and sending rendered HTML;
tests might want to delay assertions until the application becomes stable;

Usage Notes

          const pendingTasks = inject(PendingTasks);const taskCleanup = pendingTasks.add();// do work that should block application's stability and then:taskCleanup();