Ember 2 Actions Inside Each Loop

debugcn Published at Dev

Matt

Consider the following:

days_week: [
    {
        selected '',
        day: 'mon'
    },
    {
        selected '',
        day: 'wed'
    },
    {
        selected '',
        day: 'fri'
    }
]

Inside my template, I can loop through the days:

{{#each days_week as |day_week index|}}
    {{day_week.day}}
{{/each}}

Which produces this: mon wed fri

What I now want to do is assign an action, so that upon click it will add a class, and upon clicking again, it will remove the class....

{{#each days_week as |day_week index|}}
    <button class="{{day_week.selected}}" {{action 'toggle' day_week}}>
        {{day_week.day}}
    </button>
{{/each}}

However, the following code does not seem to work to (start by adding the class highlight)?

actions: {
    toggle: function(day_week){
        day_week.set('selected','highlight');
    }
}

and I get this error: TypeError: day_week.set is not a function ?

Ebrahim Pasbani

Use Ember.set. It works on any object.

Please check this out

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at2021-07-20

Comments

0 comments

From Dev

Ember: Accessing a nested object inside an #each loop

From Dev

How to add Css Class to item inside Ember's {{#each}} loop, according to index? - Ember.js

From Dev

Ember Actions 2: Using Variables Action Names

From Dev

Ember select view inside of an each not working

From Dev

Ember select view inside of an each not working

From Dev

Check for duplicates in each loop in Ember.js

From Dev

Using DisplayFor inside a for each loop

From Dev

Ajax call inside each loop

From Dev

Using conditionals inside {{each}} loop

From Dev

Loop interation inside @each directive

From Dev

Ajax call inside each loop

From Dev

Triggering events inside $.each loop

From Dev

Enable each TextBox with each CheckBox inside a loop

From Dev

Ember JS - Handlebars template - @index being undefined inside #each

From Java

cant set variable data inside the each loop

From Dev

Calling cheerio.load inside each loop

From Dev

Js change object inside array in for each loop

From Dev

handlebar comparison operator inside each loop

From Dev

Save output of each command inside for loop

From Dev

Removing the callback from inside the for-each loop

From Dev

underscore: async each loop waiting "inside"

From Dev

Iterate Counter Inside jQuery .each() Loop

From Dev

Waiting until AJAX completes inside an $.each loop

From Dev

delay() not working as expected inside of each() loop (jQuery)

From Dev

Function call inside a $.each loop, is it async or sync?

From Dev

Jquery - Each loop not working inside click event

From Dev

Control execution flow inside .each loop nodejs

From Dev

if inside for each loop pushing multidimensional array - php

From Dev

Jquery getting values of slider inside .each loop

Related Related

Article