Discipline - Groups

components.my-groups.js

import Ember from 'ember';

export default Ember.Component.extend({

disciplineGroups: Ember.computed('discipline', function(){ 
  return this.get('disciplines').filter(discipline => discipline.disciplineId === this.get('discipline'));
})
  
 /* 
  groupsFiltered: Ember.computed('discipline', 'search', function () {
    
    var groups = this.get('groups');
    var search = this.get('search');
    
    console.log('computed groupsFiltered() with discipline: ' + this.get('discipline') + ', search: ' + search);
    return groups.filter((item) => item['disciplineId'] === this.get('discipline'));
    
    // or this when I search, but I don't know how to do:
    // return groups.filter((item) => item['name'].includes(search))
  }) */
});

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  
  discipline: null,
  
  
  disciplines: [
    {
    	group: 'drilling', 
    	id: 1
    },
    {
      group: 'geology', 
      id: 2
    }, 
    {
      group: 'geophysics', 
      id: 3
    }, 
    {
      group: 'formation_evaluation', 
      id: 4
    }
  ]

});

templates.application.hbs

<br>
{{outlet}}

{{#each disciplines key="id" as |discipline|}}
	{{discipline.group}}<br>
{{/each}}

{{my-groups}}


<br>
<br>

twiddle.json

{
  "version": "0.11.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.11.0",
    "ember-data": "2.11.0",
    "ember-template-compiler": "2.11.0",
    "ember-testing": "2.11.0"
  },
  "addons": {}
}