template-no-arguments-for-html-elements.md

ember/template-no-arguments-for-html-elements

💼 This rule is enabled in the following configs: strict-gjs, strict-gts.

Disallow @arguments on HTML elements.

Arguments (using the @ prefix) are a feature specific to Ember components. They should not be used on regular HTML elements, which only support standard HTML attributes.

Rule Details

This rule disallows using @arguments on HTML elements. Use regular attributes instead.

Examples

Incorrect ❌

<template>
  <div @title="Hello">Content</div>
</template>

<template>
  <button @onClick={{this.handler}}>Click</button>
</template>

<template>
  <span @data={{this.info}}>Text</span>
</template>

Correct ✅

<template>
  <div title="Hello">Content</div>
</template>

<template>
  <button {{on "click" this.handler}}>Click</button>
</template>

<template>
  <MyComponent @title="Hello" @onClick={{this.handler}} />
</template>

Related Rules

• template-no-block-params-for-html-elements

References

• Ember Guides - Component Arguments
• eslint-plugin-ember template-no-args-paths