It's like {{link-to}}
, but renderless!
Renderless / Container / Provider Components are components that don't emit any DOM, but only yield state and actions to nested components.
ember install ember-link
This addon uses the RouterService
. Depending on your Ember version, you might
need to install
ember-router-service-polyfill
.
{{on}}
is an element modifier provided by
ember-on-modifier
.
Required.
The target route name.
Example
{{link-to}}
equivalent
Optional. Mutually exclusive with @model
.
An array of models / dynamic segments.
Example
{{link-to}}
equivalent
Optional. Mutually exclusive with @models
.
Shorthand for providing a single model / dynamic segment. The following two invocations are equivalent:
Optional.
Query Params object.
Example
{{link-to}}
equivalent
Optional. Default: true
If enabled, the transitionTo
and
replaceWith
actions will try to call
event.preventDefault()
on the first argument, if it is an
event. This is an anti-foot-gun to make <Link>
just work™️ with <a>
and
<button>
, which would otherwise trigger a native browser navigation / form
submission.
string
The URL for this link that you can pass to an <a>
tag as the href
attribute.
boolean
Whether this route is currently active, including potentially supplied models and query params.
In the following example, only one link will be is-active
at any time.
boolean
Whether this route is currently active, including potentially supplied models, but ignoring query params.
In the following example, the first two links will be is-active
simultaneously.
boolean
Whether this route is currently active, but ignoring models and query params.
In the following example, both links will be is-active
simultaneously.
(event?: Event) => Transition
Transition into the target route.
If @preventDefault
is enabled, also calls event.preventDefault()
.
(event?: Event) => Transition
Transition into the target route while replacing the current URL, if possible.
If @preventDefault
is enabled, also calls event.preventDefault()
.