AUR0814

Error Message

AUR0814: [repeat] encountered an error: number of views != number of items <view_count>!=<item_count>

Where <view_count> is the actual number of view instances created by the repeater and <item_count> is the expected number of items (specifically, the number provided when using repeat.for="i of count").

Description

This error occurs specifically when using the repeat.for syntax with a number (e.g., repeat.for="i of 5"). It indicates an internal inconsistency within the Repeat controller where the number of DOM elements (views) it has generated does not match the number it was instructed to create.

Cause

This is primarily an internal consistency check error. The _handleNumberChange method in the Repeat controller, responsible for handling numeric iteration, throws this error if its final state results in a mismatch between the target number and the managed views.

Potential (though less common) causes could include:

1. Internal Repeater Bug: An issue within the repeater's logic for adding or removing views when the bound number changes.

2. External DOM Manipulation: Although discouraged, if external code directly manipulates the DOM elements generated within the repeater in a way that removes views without the repeater's knowledge, this check might fail upon subsequent updates.

3. Concurrency Issues: Highly unlikely, but perhaps complex, overlapping updates to the bound count could theoretically lead to an inconsistent state, though Aurelia's batching and queuing typically prevent this.

In most scenarios, this error points towards a potential bug within the Repeat controller itself rather than user code, especially if the bound value is a simple number and no direct DOM manipulation is occurring.

Solution

1. Verify Binding: Ensure the value bound using repeat.for="i of count" is indeed a number and that its updates are predictable.

2. Check for External Manipulation: Confirm that no other part of your code is directly adding/removing elements within the repeat block.

3. Simplify: Temporarily replace the bound variable with a static number (e.g., repeat.for="i of 5") to see if the error persists. If it disappears, investigate how the bound variable is being updated.

4. Report Issue: If the error occurs with simple numeric binding and no external factors seem involved, it might be an Aurelia bug. Report it to the Aurelia repository with clear steps to reproduce the issue, including the relevant template and view model code.

Example

<!-- Binding to a numeric property 'itemCount' -->
<template repeat.for="i of itemCount">
  <div>Item number ${i + 1}</div>
</template>

<!-- This error would typically occur during an update to 'itemCount' -->
<!-- if the repeater's internal state becomes inconsistent. -->

import { customElement } from 'aurelia';

@customElement({ /* ... */ })
export class MyComponent {
  itemCount = 3;

  increaseCount() {
    // Updates to this value trigger the repeater logic.
    // If AUR0814 occurs, it's likely within the handling of this change.
    this.itemCount++;
  }

  decreaseCount() {
    if (this.itemCount > 0) {
      this.itemCount--;
    }
  }
}

Debugging Tips

• Place breakpoints within the Repeat controller's methods (like _handleNumberChange) in your browser's developer tools (if working with source maps/dev build) to observe the internal state (views.length vs newLen).

• Log the value of the bound number just before and after changes that seem to trigger the error.

• Simplify the template within the repeat block to rule out complex nested components interfering unexpectedly (though this is unlikely to be the cause of this specific error).

• Check the Aurelia repository for existing issues related to AUR0814 or repeat_mismatch_length.