@angular/core

contentChildren

Initializer API

Initializes a content children query.

Query results are represented as a signal of a read-only collection containing all matched elements.

API

function contentChildren<LocatorT>(locator: string | ProviderToken<LocatorT>, opts?: { descendants?: boolean | undefined; read?: undefined; debugName?: string | undefined; } | undefined): Signal<readonly LocatorT[]>;

@paramlocatorstring | ProviderToken<LocatorT>

@paramopts{ descendants?: boolean | undefined; read?: undefined; debugName?: string | undefined; } | undefined

@returnsSignal<readonly LocatorT[]>

function contentChildren<LocatorT, ReadT>(locator: string | ProviderToken<LocatorT>, opts: { descendants?: boolean | undefined; read: ProviderToken<ReadT>; debugName?: string | undefined; }): Signal<readonly ReadT[]>;

@paramlocatorstring | ProviderToken<LocatorT>

@paramopts{ descendants?: boolean | undefined; read: ProviderToken<ReadT>; debugName?: string | undefined; }

@returnsSignal<readonly ReadT[]>

Usage Notes

Create a children query in your component by declaring a class field and initializing it with the contentChildren() function.

          @Component({...})export class TestComponent {  headerEl = contentChildren<ElementRef>('h');   // Signal<ReadonlyArray<ElementRef>>}