CODEWITHSUNDEEP
javascriptember.js
user2024080
user2024080

Reputation: 5101

How to add `action` to component element in EmberJs?

I am wrapping my component with li element. that's fine. But I am trying to add the action to wrapped element too.. But getting error. what is the correct way to add action to wrapped element?

any one help me?

my component:

<ul>
        {{#each cardList as |card index |}}
                {{
                    cs2i-cardcomponent 
                    card=card
                    index=index
                    enableNext='enableNext'
                    tagName="li"
                    {{action "selectCard card index"  }}//not works. trying to pass card and index to selected card in actions object in componet.js.
                }}
        {{/each}}
    </ul>

my component js :

import Ember from 'ember';

export default Ember.Component.extend({
    tagName:"",
    firstBalanceType : '',
    firstBalanceAmount : '',
    lastBalanceType : '',
    lastBalanceAmount : '',
    isSelected : false,


    actions : {
        selectCard : function(card,index) {
            this.set('selectedIndex', index );
            this.toggleProperty('isSelected');
            this.sendAction('enableNext', card);
        }
    }
});

Upvotes: 1

Views: 227

Answers (1)

Ember Freak
Ember Freak

Reputation: 12872

Here you are sending selectCard closure action which wraps selectCard functions which is defined in current context.

{{cs2i-cardcomponent card=card index=index enableNext='enableNext' tagName="li" selectCard=(action "selectCard" card index)}}

Instead of the above I will encourage you to send the required data as params to component, from there you can send to data in arguments.

Follow ember guides

Upvotes: 1

Related Questions