Function references
In Aurelia, you can use the .call binding command to invoke functions directly from your view. This is particularly useful when you need to pass specific arguments or control the context in which the function is called.
<element click.call="myFunction(arg1, arg2)"></element>How It Works
When you use .call, Aurelia will:
Evaluate the expression in the context of your view-model
Invoke the resulting function with the provided arguments
Set the function's
thiscontext to the view-model
Examples
Basic usage
<button click.call="greet('World')">Say Hello</button>export class MyViewModel {
greet(name) {
alert(`Hello, ${name}!`);
}
}Passing Event Object
You can pass the event object using $event:
<input keyup.call="handleKeyUp($event)">export class MyViewModel {
handleKeyUp(event) {
console.log('Key pressed:', event.key);
}
}Tips
Use
.callwhen you need to pass specific arguments to your function.It's great for one-time function calls that don't need to update bindings.
Remember,
.calldoesn't create a persistent binding like.binddoes.
Last updated
Was this helpful?