Working with Refs & PortalsEntry 6 of 6
Summary
| Concept | React | Angular |
|---|---|---|
| Access a DOM element | useRef() + ref={} | viewChild() + #ref |
| Mutable, non-reactive value | useRef() | Plain class field |
| Reactive value | useState() | signal() |
| Pass a ref to a child | ref prop (React 19) / forwardRef (legacy) | viewChild(ChildComponent) |
| Expose child methods | useImperativeHandle() | Public methods on the class |
| Render outside the DOM tree | createPortal() | CDK Dialog / Overlay + portals |
React's refs, imperative handles, and portals give fine-grained, explicit control over the DOM. Angular reaches the same results with template reference variables, signal queries (viewChild()), public component methods, and the CDK's injectable overlay services.