TimeoutController
Purpose
Utility controller to wire up other controller actions that need to fire after an elapsed time.
Actions
| Action | Purpose |
|---|---|
- | - |
Targets
| Target | Purpose | Default |
|---|---|---|
- | - | - |
Classes
| Class | Purpose | Default |
|---|---|---|
- | - | - |
Values
| Value | Type | Description | Default |
|---|---|---|---|
seconds | Number | The number of seconds until the action fires | - |
Events
| Event | When | Dispatched on | event.detail |
|---|---|---|---|
timeout:action | Fired after secondsValue seconds, used to wire your desired controller actions to | the controller root element | element: the controller root element |
Side Effects
Calls setTimeout with the desired timeout. Cleans up on disconnect if that happens before timeout occurs.
How to Use
An example: Show a marketing popup after 30 seconds.
<div data-controller="popup dismissable" data-action="timeout:action->popup#open">
<meta data-controller="timeout" data-timeout-seconds-value="30" />
<p>Sign up to get great deals!</p>
<a data-action="click->dismissable#dismiss">No thanks</a>
</div>