How to implement edit function in nested component emberjs

Ember says data down action up. in my case projects hasMany cards and card has content. If i want to edit the content in card how should I go about it. since data belongs to cards controller I guess it will be in appropriate to edit it cards-generic component and sending cards action up does not feel right.

//router.js

Router.map(function() {
  this.route('projects',     function() {
    this.route('project', { path: '/:project_id' }, function() {
        this.route('cards');
        this.route('new',{ path: '/cards/new' });
    });
  });
});

-- cards.hbs

{{#each card in model}}
    {{card-generic card=card delContent="delCard" updateContent="updateContent" class="card"}} 
{{/each}}
{{outlet}}

-- component/ cards-generic.hbs

<div class="card"> 
  {{#if isEditing}}
     <input value={{card.content}} id="edit-content-text">
     <button id="update-content" {{action "updateContent" card}} >update</button>
   {{else}}
        <div class="content">{{card.content}}</div> 
        <span class="del-card" {{action "delContent" card on="click"}}> X </span><br>
        <span class="edit-content" {{action "editContent" card on="click"}}> edit </span><br>
        {{textarea value=name }} <br>
        {{input type="submit" value="submit" }}
   {{/if}}
</div>

--

controller/cards.js

import Ember from 'ember';

export default Ember.ArrayController.extend({
    needs: ['projects/project'],
    project: Ember.computed.alias('controllers.projects/project'),
    actions: {
        delCard: function(card) {
            console.log('please delete the below card');
            card.deleteRecord();
        },
        updateContent: function(card) {

           //what should I do here
        }
    }
});