template-no-obscure-array-access.md

ember/template-no-obscure-array-access

💼 This rule is enabled in the 📋 template-lint-migration config.

🔧 This rule is automatically fixable by the --fix CLI option.

Disallow obscure array access patterns in templates.

Rule Details

This rule discourages the use of obscure array access patterns in templates, including:

• Numeric array index access like {{list.[0]}} or {{list.[1].name}}
• @each property access like {{items.@each.name}}
• [] property access like {{items.[].property}}

Using obscure expressions like {{list.[1].name}} is discouraged. This rule recommends the use of Ember's get helper as an alternative for accessing array values.

Examples

Examples of incorrect code for this rule:

<template>
  <Foo @bar={{@list.[0]}} />
</template>

<template>
  {{@list.[1].name}}
</template>

<template>
  {{items.@each.name}}
</template>

<template>
  {{items.[].property}}
</template>

Examples of correct code for this rule:

<template>
  <Foo @bar={{get @list '0'}} />
</template>

<template>
  {{get @list '1.name'}}
</template>

<template>
  {{#each items as |item|}}
    {{item.name}}
  {{/each}}
</template>

References

• eslint-plugin-ember template-no-obscure-array-access