angular / angular/components

bug(cdkTextareaAutosize): Textarea padding breaks auto-height work

Offen
#26,997 8 Kommentare 14 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: cdk/text-field P3
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

### Description

It is not possible to set vertical padding for Textarea
- it doesn't count
- as you enter text, the height of the field increases without adding a newline

### Reproduction

Steps to reproduce:
1. Use
```
cdkTextareaAutosize
cdkAutosizeMinRows="1"
cdkAutosizeMaxRows="10"
```
3. Add padding to style ".textarea {padding: 10px;}"

### Expected Behavior

- added padding
- the height only changes when the text is increased by one line

### Actual Behavior

- field height increases for each letter
- vertical padding is not taken into account

stackblitz - [https://stackblitz.com/edit/angular-zqu9zw](https://stackblitz.com/edit/angular-zqu9zw?file=src%2Fmain-component.html)

### Environment

- Angular: 15.2.8
- CDK/Material: 15.2.8
- Browser(s): Chrome Version 112.0.5615.138
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 10

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit der cdkTextareaAutosize-Reproduktion im verlinkten StackBlitz und vergleiche ihr Verhalten mit den angegebenen Padding- und Zeileneinstellungen. Die Arbeit ist abgeschlossen, wenn der vertikale Padding in die berechnete Höhe einbezogen wird und die Textarea nur wächst, wenn der Text eine Zeile hinzufügt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Klar beschrieben
Anfängerfreundlichkeit
50/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.