Input field binding

Learning Team
1

URL: http:/localhost:4200/bands

Ember.js version: 2.18.0

/templates/bands.hbs

{{input type="text" class="new-band" placeholder="New Band" value=name}}
<button class="btn btn-primary btn-sm new-band-button" onclick={{action "createBand"}}>Add</button>

/controllers/bands.js

export default Controller.extend({
  name: 'abc',

  actions: {
    createBand(){
      var x = this.get('name');
      this.set('name', '');
    }
  }
});

The x in createBand() funciton is always ‘abc’ whatever I typed in. Anyone can help?

2

What’s happening when you add {{name}} to your template? It should automatically change while you’re typing. So there shouldn’t be a need for a separate action to set the changes.

3

It turned out there was some redundant code somewhere else interfering ember.js binding. Thanks anyway.

1 Like