Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2 material design, setting minimal rows for autosize textarea

Does anybody know how to set minimal rows for autosize Angular 2 material design textarea input element?

Here's my sample:

<md-input-container class="input-field message">
    <textarea md-input md-autosize minRows="3" placeholder="Message" name="message"></textarea>
</md-input-container>

Here's source codes: https://github.com/angular/material2/blob/master/src/lib/input/autosize.ts

I noticed that it has input variable minRows and setting [minRows]="3" still didn't help.

I kinda stuck, please help.

update: I've tried to repeat this issue on plunkr and haven't succeeded. Seems my local CSS overrides somehow Angular material style.

like image 745
Sergey Zykov Avatar asked Jan 31 '17 16:01

Sergey Zykov


1 Answers

I had the same problem today and this works for me

<md-input-container class="full-width">
    <textarea mdInput mdTextareaAutosize minRows="6" placeholder="Beschrijving" id="description" formControlName="description"></textarea>
</md-input-container>

the textarea starts with 6 rows and expands if needed.

like image 120
Marco St Avatar answered Oct 15 '22 06:10

Marco St