Q:

How can I bind a transform function to a property?

I would like to have a subclass of TextField that applies a transform to the value, but I would like the particular transform to be dynamic.
I naively did this:
{{transforming-input transformer=myTransformer ...}}

TransformingInputComponent = Ember.TextField.extend({
  transformedValue: function() {
    var transformer = this.get('transformer');
    return transformer.apply(this, [this.get('value')]);
  }.property('value'),
})

Controller = Ember.ObjectController.extend({
  myTransformer: Ember.String.camelize
})

but it doesn't work; when you bind a function to a property, you get undefined on the other side. (I verified it was not a typo or other error by changing the binding to a string)

A:

What I ended up doing was binding a dotpath to transformer, and looking up the transform function:
{{transforming-input type='text' transformer="Ember.String.handleize" ... }}

transformFunction: function() {
  var path = this.get('transformer').split('.');
  var scope = window;
  if (Ember.isNone(window[path[0]])) {
    scope = this.get('_parentView.controller');
  }
  for(var i=0;i < path.length; i++){
    scope = scope[path[i]];
    if (Ember.isNone(scope)) {
      break;
    }
  }
  return scope;
}.property('transformer'),

transformedValue: function() {
  var transformer = this.get('transformFunction');
  if(Ember.isEmpty(transformer)){
    transformer = this.get('noop')
  }
  return transformer.apply(this.get('_parentView.controller'), [this.get('value')]);
}.property('value'),

