DEV Community

Cover image for Angular 2+ dynamic input width 📏

Angular 2+ dynamic input width 📏

razvanstatescu profile image Răzvan Stătescu ・1 min read

I've recently had a project where I had to dynamically adjust the width of an input, based on the content size.

It might sound hard to do, but in reality is very simple. We achieve this by taking advantage of the size attribute.

We start by creating a new Angular directive using ng g directive [path]

After that, we write our directive as follows:

Now, you can use it like this: <input type="text" dynamic-input />

Discussion (0)

Editor guide