# AUR0801

## Error Message

`AUR0801: "& self" binding behavior only supports listener binding via trigger/capture command.`

## Description

This error occurs when the `& self` binding behavior is applied to a binding expression that is not an event listener created with the `.trigger` or `.capture` binding commands.

## Cause

The `& self` binding behavior is specifically designed to modify the behavior of event listeners. Its purpose is to prevent the event listener from being invoked if the event originated from a descendant element rather than the element the listener is attached to directly.

Applying `& self` to other types of bindings, such as property bindings (`.bind`, `.to-view`, `.from-view`), interpolation (`${}`), or other binding commands, is invalid because the concept of checking the event target against the current element doesn't apply in those contexts.

## Solution

1. **Apply Only to Event Listeners:** Ensure that the `& self` binding behavior is only used in conjunction with the `.trigger` or `.capture` binding commands.
2. **Remove from Other Bindings:** If you have applied `& self` to a non-event binding, remove it. It serves no purpose there and causes this error.

## Example

```html
<!-- Incorrect: Applying & self to .bind -->
<input value.bind="message & self">

<!-- Incorrect: Applying & self to interpolation -->
<p>Value: ${count & self}</p>

<!-- Correct: Applying & self to .trigger -->
<div click.trigger="handleClick() & self">
  <button>Click Me</button> <!-- handleClick will NOT run if this button is clicked -->
  Clicking here directly will run handleClick.
</div>

<!-- Correct: Applying & self to .capture -->
<div focus.capture="handleFocus() & self">
  <input> <!-- handleFocus will NOT run if this input receives focus -->
</div>
```

```typescript
// View Model
import { customElement } from 'aurelia';

@customElement({ /* ... */ })
export class MyComponent {
  message = 'Hello';
  count = 0;

  handleClick() {
    console.log('Div clicked directly');
  }

  handleFocus() {
    console.log('Div captured focus directly');
  }
}
```

## Debugging Tips

* Carefully review the binding expression where the error occurs.
* Verify that the binding command used immediately before the `& self` behavior is either `.trigger` or `.capture`.
* If you intended to check the source of an event, ensure you are using an appropriate event binding command.