Binding emberjs

I'm having issues with binding to emberjs. I bound the ember field to a variable inside the controller. When I write to the text box, the associated variable is updated correctly.

Now I want to change the variable (and the text in the text box) through JS. Nothing happens when I do this.

App = Ember.Application.create({});

App.FormInfo = Em.TextField.extend({
    insertNewline: function(){
        App.AController.clear();
    }
});

App.AController = Em.ArrayController.create({
    content: [],
    name: '',
    clear: function(){ //I want this function to clear the text field and set name to an empty string
        this.name = '';
        console.log(this.name);//expected empty string; actual user input
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-0.9.5.min.js"></script>
<script type="text/x-handlebars">
    {{view App.FormInfo placeholder="Name" valueBinding="App.AController.name"}}
</script>
Run codeHide result
+5
source share
1 answer

You need to use setso

this.set('name', '');

instead of what you did.

this.name = '';

KVO / Binding material is used only when using compatible methods; therefore, these methods exist in the first place.

Here is a working fiddle.

+10
source

All Articles