evseevdev/ngx-textarea-autosize

textarea height is not adjusted accroding to it's content when reloading the page.

Opened this issue · 9 comments

Deleted user commented

While typing the text in to textarea height is adjusting accroding to it's content.but after reloading the page height of the textarea is setting to intial height.check screenshot.
whiletyping
afterreloading

This is the html mark up

<textarea placeholder="Enter Explanation {{statement.id}}" [(ngModel)]="statement.Expl" autosize></textarea>
RenuDaffodilsw commented

Hi @evseevdev have you fixed this bug ?
I am facing the same problem.

HrideshDaffodil commented

Hi @evseevdev,

I am facing the same issue. Have you fixed it?

josexs commented

Lo mismo por aqui, bug sin solucionar...

martijnckx commented

I am encountering the same issue.

kombadzomba commented

Me too after upgrade to Angular6 and ngx-textarea-autosize to 2.0.0. Previous version was 1.1.1 and it was ok with ng5 but 1.1.1 does not work with ng6.

UPDATE: Had to revert to 1.1.1 on ng6. Couldn't use tsconfig on ng6... instead copied autosize.directive.ts and index.ts directly to my current project.

nbunney commented

Looks like still not fixed. Any update @evseevdev. Praying for you have the time to get this fixed sometime soon. Thanks for a great directive.

MrCroft commented

I'm also facing this issue when I change the content programmatically (patchValue on the form control).
I suppose it's more or less the same issue, a title like "textarea height is not adjusted [...] when content comes from any other source, other than direct user input" would probably cover more ground.
In addition to resizing in ngOnInit() (based on the content), it would have been great if the directive exposed the resize() method, so we could also call it ourselves when needed. Ideally, it should also handle being a part of a reactive form.

nektobit commented

It seems to me that I solved all my problems with the autosize, I did this:

  1. Install this: https://github.com/TinkoffCreditSystems/angular-contenteditable-accessor
  2. Create simple editable div:
                  <div
                    [formControl]="form.get('header')"
                    contenteditable
                  ></div>
  1. Textarea look solved by CSS:
div {
    resize: both;
    overflow: hidden;
}
  1. And last step placeholder - https://codepen.io/flesler/pen/AEIFc
evseevdev commented

@gangamweb @RenuDaffodilsw @HrideshDaffodil @josexs @martijnluyckx @kombadzomba @nbunney @MrCroft @nektobit please, update package version to 2.0.2