@Input('uiOptions') The transition options
<a uiSref="books" [uiOptions]="{ reload: true }">Book </a>
@Input('uiParams') The parameter values to use (as key/values)
<a uiSref="book" [uiParams]="{ bookId: book.id }">Book </a>
@Input('uiSref') The name of the state to link to
<a uiSref="hoome">Home</a>
An observable (ReplaySubject) of the state this UISref is targeting. When the UISref is clicked, it will transition to this TargetState.
When triggered by a (click) event, this function transitions to the UISref's target state
When triggered by a (click) event, this function transitions to the UISref's target state
Generated using TypeDoc
A directive when clicked, initiates a Transition to a TargetState.
Purpose
This directive is applied to anchor tags (
<a>) or any other clickable element. It is a state reference (or sref -- similar to an href). When clicked, the directive will transition to that state by calling StateService.go, and optionally supply state parameter values and transition options.When this directive is on an anchor tag, it will also add an
hrefattribute to the anchor.Selector
[uiSref]: The directive is created as an attribute on an element, e.g.,<a uiSref></a>Inputs
uiSref: the target state's name, e.g.,uiSref="foostate". If a component template uses a relativeuiSref, e.g.,uiSref=".child", the reference is relative to that component's state.uiParams: any target state parameter values, as an object, e.g.,[uiParams]="{ fooId: bar.fooId }"uiOptions: TransitionOptions, e.g.,[uiOptions]="{ inherit: false }"<!-- Targets bar state' --> <a uiSref="bar">Bar</a> <!-- Assume this component's state is "foo". Relatively targets "foo.child" --> <a uiSref=".child">Foo Child</a> <!-- Targets "bar" state and supplies parameter value --> <a uiSref="bar" [uiParams]="{ barId: foo.barId }">Bar </a> <!-- Targets "bar" state and parameter, doesn't inherit existing parameters--> <a uiSref="bar" [uiParams]="{ barId: foo.barId }" [uiOptions]="{ inherit: false }">Bar </a>