CODEWITHSUNDEEP
bindingtextareaember.jshelper
lipp
lipp

Reputation: 5926

Ember.TextArea set input through handlebars helper

I got a Ember.Handlerbars.JSON helper, which formats a given value to an indented JSON string. I'd like to set the content (value) of a textarea like this:

    {{#view Ember.TextArea}}
       {{JSON someValue}}
    {{/view}}

This does not work, since what I should set the textareas' "value" attribute instead.

However, this also doe not work

    {{view Ember.TextArea valueBinding="JSON someValue"}}

Upvotes: 2

Views: 3163

Answers (1)

pangratz
pangratz

Reputation: 16163

You could solve this by using a computed property, see http://jsfiddle.net/pangratz666/3A33H/:

Handlebars:

<script type="text/x-handlebars" >
    {{#with App.jsonController}}
        {{view Ember.TextArea valueBinding="formatted" rows="10" }}    
    {{/with}}
</script>​

JavaScript:

App = Ember.Application.create({
    formatJSON: function(obj) {
        return JSON.stringify(obj, null, '\t');
    }
});

App.jsonController = Ember.Object.create({
    content: {
        abc: 123,
        foo: 'hello'
    },

    formatted: function() {
        var obj = this.get('content');
        return App.formatJSON(obj);
    }.property('content')
});​

Update to your comments:

In the fiddle in the comment ( http://jsfiddle.net/4QNur/ ) your are declaring {{view Ember.TextArea valueBinding="JSON App.someComplexValue"}}: this does not work since valueBinding takes a path as argument and not an expression, like JSON App.someComplexValue. If you want to bind to a transformed value, just create a computed property and bind to this. That's the Ember way of doing such stuff...

In your original question you have the following code:

{{#view Ember.TextArea}}
    {{JSON someValue}}
{{/view}}

This does not work in this case, since the value for the Ember.TextArea can only be set via a value respectively valueBinding:

{{view Ember.TextArea valueBinding="App.controller.transformedComplexValue" }}

Upvotes: 5

Related Questions