Test

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  show: null,
  menus: Ember.computed('model', function() {
    return this.model;
  }),
  actions: {
    showMatch(id) {
      //alert('Start');
      var menus = this.get('menus');
      var menu = menus[id];
      Ember.set(menu, 'showExtra', true);
    }
  }
});
	

routes.application.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return [
      {
        id: 1,
        name: 'First',
        extra: 'First extra',
        showExtra: false
      },
      {
        id: 2,
        name: 'Second',
        extra: 'Second extra',
        showExtra: false
      }
    ]
  }
});

templates.application.hbs

 <table class="table table-striped" border="1">
  <thead>
    <th>Name</th>
  </thead>
  <tbody>
  {{#each menus as |menu|}}
    <tr>
      <td><a href="#" {{action "showMatch" menu.id}}>{{menu.name}}</a></td>
    </tr>
    {{#if menu.showExtra}}
    <tr>
      <td colspan="1">
        <table class="table table-striped">
          <tr><th>Away</th><td>{{menu.extral}}</td></tr>
        </table>
      </td>
    </tr>
    {{/if}}
  {{/each}}
  </tbody>
</table>

twiddle.json

{
  "version": "0.4.8",
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.8/ember.js",
    "ember-data": "https://cdnjs.cloudflare.com/ajax/libs/ember-data.js/1.13.9/ember-data.js",
    "ember-template-compiler": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.8/ember-template-compiler.js"
  }
}