Current version 22.0.0

Focus service

import { FocusService } from '@trademe/tangram';

FocusService is used to manage focus states. To set the initial focus on page load, use auto focus.

Example

Methods

isElementFocused (element: ElementRef): boolean

Used to know if an element is focused.

focusElement (element: ElementRef | any): void

Used to set programmatic focus. For example, when closing a modal, focusElement is used to return a user to their previous place on a page.

setElementTabbable (element: ElementRef, tabbable: boolean): void

Allows you to put any element into the tab index. When possible, consider ways to simplify layout instead to create a more consistent experience for all users.

tryScrollIntoView (element: ElementRef, option: TryScrollIntoViewOption = TryScrollIntoViewOption.nearest): void

Used to scroll to an element. For example, when navigating to the next page in pagination. TryScrollIntoViewOption is an enum with three options, start, end and nearest.

Proudly made by © 2026 Trade Me Limited