How to create a custom Ember.TextField with Handlebars helper?

#1

Hi,

I want to create a custom Ember.TextField with a Handlebars helper. Looks like this:

import Ember from 'ember';

export function attributeView( input, options ) {

  var viewDef = Ember.TextField.extend({});
  var view = viewDef.create();

  return Ember.Handlebars.helpers.view.call( this, view, options );
};

export default Ember.Handlebars.makeBoundHelper(attributeView);

With this I get the following error:

Uncaught TypeError: Cannot read property ‘pushChildView’ of null vendor.js:53216merge.appendChild vendor.js:53216CoreView.extend.appendChild vendor.js:55003EmberObject.create.helper vendor.js:21706viewHelper vendor.js:21933attributeView rpcfe-embercli/helpers/attribute-view.js:31bindView.normalizedValue vendor.js:19342SimpleHandlebarsView.render vendor.js:22294EmberRenderer_createElement vendor.js:51582Renderer_renderTree vendor.js:22684(anonymous function) vendor.js:22761DeferredActionQueues.invoke vendor.js:12735DeferredActionQueues.flush vendor.js:12805Backburner.end vendor.js:12191Backburner.run vendor.js:12246run vendor.js:30279hash.success vendor.js:69626fire vendor.js:3191self.fireWith vendor.js:3303done vendor.js:8369(anonymous function) vendor.js:8716

#2

You cannot push child views (which is what calling Ember.Handlebars.helpers.view is doing) from makeBoundHelper.

It is highly likely that this should be a component instead of a helper.

#3

Ah ok, thank you. Then I need another way. Perhaps someone can give me a hint:

I have several attribute-model-objects with a type property. Based on the type property I want to decide which (view/component) should be rendered.

If property is "input":
  create input-(view/component)
else if property is "textarea":
  create textarea-(view/component)