Angular textarea matInput: how can set max length/line + max number of lines
use [maxLength]
property
<textarea #txtarea matInput [maxLength]="maxNo" (change)='txtAreaChange()' [placeholder]="label" [(ngModel)]='text'></textarea>
For this specific need/behavior, you need to create a simple custom validator
maxLinesValidator(limit: number): ValidatorFn {
return (control: AbstractControl): {[key: string]: any} | null => {
const exceeded = control.value.length && control.value.split('\n').length > limit;
return exceeded ? {'maxLines': {value: true}} : null;
};
}
That you'll bind to your FormControl. You can take a look at this working fiddle (src/app/reactive
.ts + html) where the text
field is validated in real time and displays an error if user exceed the maximum lines limit