How to prevent user type in input textbox more than specified number of input character in angular?

1168 views angular
10

i use textarea tag and i want when user type in that, she can not type more than forexample 300 character. i write code and i have real time character number that user type but i want when it comes to 300 character she can not type anymore.

here is my html code:

<textarea type="text" 
                    id="textAreaScroll"
                    formControlName="text"
                    placeholder="??? ..."
                    (keyup)="postLengthCheck()">
          </textarea>
          <span *ngIf="createPostForm.controls['text'].valid" class="text-counter">{{validTextLength}}</span>

and here is my postLengthCheck() method im my component:

postLengthCheck() {

      if (this.createPostForm.controls['text'].value !== null) {
        this.postLength = this.createPostForm.controls['text'].value.length;
        this.validTextLength = 2200 - this.postLength;
      }
  }

how can i fix this ?

answered question

Just use maxlength='300' property in your <textarea> that might work

1 Answer

9

Why not use [maxLength]="'300'"

<textarea type="text" style="margin-bottom: 25px"
                id="textAreaScroll"
                formControlName="text"
                placeholder="??? ..."
                (keyup)="postLengthCheck()"
                 [maxLength]="'300'"`>
      </textarea>

posted this

Have an answer?

JD

Please login first before posting an answer.