# AUR0720

### **Error message**

Spreading syntax `"...xxx"` is reserved. Encountered `"...{{0}}"`

### **Parameters**

1. `target`: The invalid spread target encountered (e.g., `...my-data`).

### Error explanation

This error occurs during template compilation when an attribute uses the spread syntax (`...`) but the target specified after the dots is not a recognized reserved keyword. Aurelia reserves the spread syntax for specific purposes:

* `...$attrs`: Used within a component's template to pass through all attributes captured from the component's usage to an inner element.
* `...$bindables`: Used on a custom element to spread properties from an object onto the element's bindable properties.
* `...$element`: Used on a custom element to spread properties from an object directly onto the element instance (use with caution).

Using the spread syntax with any other target (e.g., `...my-object`, `...some-prop`) is not allowed.

### Common causes

* Attempting to use the spread syntax with a custom target name.
* A typo in one of the reserved spread targets (e.g., `...$attr` instead of `...$attrs`).

### How to fix

* Ensure you are using one of the valid reserved spread targets: `...$attrs`, `...$bindables`, or `...$element`.
* Correct any typos in the spread target name.
* If you intended to bind multiple properties from an object, use `...$bindables` on a custom element or bind properties individually.

### Example of Incorrect Usage:

```html
<!-- Error: "...my-data" is not a valid spread target -->
<my-component ...my-data.bind="someObject"></my-component>

<!-- Error: Typo in reserved target -->
<template>
  <div ...$attr></div> <!-- Should be ...$attrs -->
</template>
```

### Example of Correct Usage:

```html
<!-- Spreading captured attributes -->
<template>
  <div ...$attrs>
    <slot></slot>
  </div>
</template>

<!-- Spreading onto bindables -->
<my-element ...$bindables.bind="viewModelProperties"></my-element>

<!-- Spreading onto element instance (use carefully) -->
<my-element ...$element.bind="objectWithMatchingProperties"></my-element>
```