Skip to content

routeActive()

ts
const routeActive: (...values: [string, string]) => DirectiveResult<typeof RouteActiveDirective>;

Reactive directive to check for the current route being active. Can be used directly on an element to toggle a css class or with a boolean attribute or property.

Parameters

values

...[string, string]

Returns

DirectiveResult<typeof RouteActiveDirective>

Examples

Either toggle a CSS class on the element, ...

html
<a href="/home" ${routeActive('/home', 'active')}>Home</a>

Or set a boolean attribute or property with the result of the directive.

html
<button href="/home" ?disabled="${routeActive('/home')}">Home</button>