How to add the number with `index` in `hbs` template

Question

I am trying to add a number to an existing index value but I am getting an error. How to solve this?

Here is my try: both tabindex="{{index+1}}", and class="digit{{index+1}}" throw an error.

{{#each  cardDigitField as  |field index|}}
    <input type="number" tabindex="{{index+1}}" min="0" max="9" maxlength="1" value='' 
    onKeyUp={{action "numberEntered" index}} 
    onKeyPress={{action "numberInit" }} class="digit{{index+1}}">
{{/each}}

Answer 1

You might learn about template expressions from Angular, but template expressions are not supported in Ember by default. What you can do is using an Ember template helper.

Either you create your own or use an addon (for example ember-composable-helpers).

{{#each  cardDigitField as  |field index| }}
    <input type="number" tabindex="{{inc index}}" min="0" max="9" maxlength="1" value='' 
        onKeyUp={{action "numberEntered" index}} 
        onKeyPress={{action "numberInit" }} class="digit{{inc index}}">
{{/each}}