Signal queries

You can query the component’s view with viewChild. In the example below, a template reference #search in the input element allows the component to reference it via viewChild. When onSearch() is called, it displays the content of the element. Since searchInput is of type signal (Signal<ElementRef<any>>), you can use it withh effect and computed.

<input placeholder="Search for something" (keyup.enter)="onSearch()" #search />

  import { viewChild } from '@angular/core';

  searchInput = viewChild.<ElementRef>('search');

  onSearch() {
    const query = this.searchInput()?.nativeElement.value;
    console.log('search query', query);
  }