How to overwrite the built in `<Input />` component

1

Now that we have the ability to invoke the {{ input }} helper using the angle brackets syntax (<Input />), how can a person overwrite it?

Looks like creating app/components/input.js is not doing the trick. Using an initializer and registering the component manually app.register('component:input', Input) is not working as well.

Any ideas?

2

In the immediate, two ideas come to mind-

  • name it something else
  • use a native html input instead

Have you already tried those things? Is there more to consider for your use case?

3

Thank you for the reply @melsumner

If there is no way to overwrite this component, then this change feels like a breaking change. Do you think that it makes sense to promote this to an issue in the Ember.js repo?

4

tbqh, I thought you already couldn’t override input. @rwjblue what do you think?

5

You could override it in the past; my old team did it (:sob: would not do again).

@mupkoo does it still work to override using {{input}} and not with <Input />, or do both now break?

Does it make any difference if you import the original and extend it?

1 Like
6

I think that {{ input }} was a helper so far, so it was possible to create a input.js component and call it like <Input />

7

Haven’t tried using the curly bracket syntax, but I think that it is not going to work as well.