UISrefStatus | @uirouter/angular
Options
All
  • Public
  • Public/Protected
  • All
Menu

A directive which emits events when a paired UISref status changes.

This directive is primarily used by the UISrefActive directives to monitor UISref(s).

This directive shares two attribute selectors with UISrefActive:

  • [uiSrefActive]
  • [uiSrefActiveEq].

Thus, whenever a UISrefActive directive is created, a UISrefStatus directive is also created.

Most apps should simply use UISrefActive, but some advanced components may want to process the SrefStatus events directly.

<li (uiSrefStatus)="onSrefStatusChanged($event)">
  <a uiSref="book" [uiParams]="{ bookId: book.id }">Book </a>
</li>

The uiSrefStatus event is emitted whenever an enclosed uiSref's status changes. The event emitted is of type SrefStatus, and has boolean values for active, exact, entering, and exiting; also has a [[StateOrName]] identifiervalue.

The values from this event can be captured and stored on a component (then applied, e.g., using ngClass).


A single uiSrefStatus can enclose multiple uiSref. Each status boolean (active, exact, entering, exiting) will be true if any of the enclosed uiSref status is true. In other words, all enclosed uiSref statuses are merged to a single status using || (logical or).

<li (uiSrefStatus)="onSrefStatus($event)" uiSref="admin">
  Home
  <ul>
    <li> <a uiSref="admin.users">Users</a> </li>
    <li> <a uiSref="admin.groups">Groups</a> </li>
  </ul>
</li>

In the above example, $event.active === true when either admin.users or admin.groups is active.


This API is subject to change.

Hierarchy

  • UISrefStatus

Index

Constructors

constructor

Properties

status

status: SrefStatus

The current status

uiSrefStatus

uiSrefStatus: EventEmitter<SrefStatus> = new EventEmitter<SrefStatus>(false)

current statuses of the state/params the uiSref directive is linking to

Methods

ngAfterContentInit

  • ngAfterContentInit(): void

ngOnDestroy

  • ngOnDestroy(): void

Generated using TypeDoc