New Twiddle

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  locales: Ember.ArrayProxy.create({ content: Ember.A(['de_DE', 'fr_FR']) }),
  someValue: '',
  actions: {
    addNew() {
      console.log('add new');
      const locales = this.get('locales');
      const value = this.get('someValue');               locales.addObject(value);
      this.set('someValue', '');
    }
  }
});

helpers.eq.js

import Ember from 'ember';

export function eq(params/*, hash*/) {
  return params[0] === params[1];
}

export default Ember.Helper.helper(eq);

templates.application.hbs

<h1>Welcome to {{appName}}</h1>
<br>
<br>
{{outlet}}
<br>
<button type="button" {{action 'addNew'}}>Add new</button>
<ul>
{{#each locales as |locale index|}}
  <li>{{locale}}</li>
	{{#if (eq index (get locales 'length'))}}
  <li>the end!!</li>
  {{/if}}
{{/each}}
<li>{{input type="text" class="foobar" value=someValue enter=(action 'addNew')}}</li>
</ul>

twiddle.json

{
  "version": "0.10.6",
  "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.9.0",
    "ember-data": "2.9.0",
    "ember-template-compiler": "2.9.0",
    "ember-testing": "2.9.0"
  },
  "addons": {}
}