@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
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>