How does the newer signal based viewChild function differ from the traditional ViewChild decorator?

The viewChild function returns a signal instead of a plain property, letting you read the referenced element or component reactively, and it can be marked as required, causing a clear error if the referenced element is unexpectedly missing, rather than silently being undefined.

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

export class ParentComponent {
  child = viewChild.required(ChildComponent);

  ngAfterViewInit() {
    console.log(this.child()); // called as a function, since it is a signal
  }
}