Angular 文本区域 matInput : how can set max length/line + max number of lines

Question

以下 html 代码片段:

<mat-form-field class='textarea'>
    <textarea #txtarea matInput (change)='txtAreaChange()' [placeholder]="label" [(ngModel)]='text'></textarea>
    <mat-hint [class.red]="txtarea.value.split('\n').length > textAreaLimit[1]" align="start"> {{txtarea.value ? txtarea.value.split('\n').length : 0}}/{{textAreaLimit[1]}} lines</mat-hint>
    <mat-hint [class.red]="txtarea.value && txtarea.value.split('\n').map( len).max() > textAreaLimit[0]" align="end">Longest line: {{txtarea.value ? txtarea.value.split('\n').map( len).max() : 0}}/{{textAreaLimit[0]}}</mat-hint>
</mat-form-field>

定义一个带有双向绑定(bind)的文本输入框。它确实检查大小:行总数和行的最大长度。如果这些大于 textAreaLimit 中给出的某些约束，则提示变为红色。

我想更改它以便用户无法打破此约束，例如如果最大行数为 3 并且有 3 行用户无法添加新行。如何在不破坏双向绑定(bind)的情况下做到这一点？

Answer 1

使用[maxLength]属性

<textarea #txtarea matInput  [maxLength]="maxNo" (change)='txtAreaChange()' [placeholder]="label" [(ngModel)]='text'></textarea>