1

I would like to check out my textarea length. This is my code:


<div class="row d-flex justify-content-center textarea-wrapper">
    <p class="mb-1">Additional information to order:</p>
      <textarea class=" additionalInformation justify-content-center" name="additionalInformation"
      value="{{additionalInformation}}" formControlName="additionalInformation" placeholder="text..."
           [maxlength]="maxCharsOfArea"></textarea>

       <span *ngIf="signupForm.controls['additionalInformation'].value.length">
     {{signupForm.controls['additionalInformation'].value.length}} /{{maxCharsOfArea}}</span>
</div>

View:
enter image description here

On Load my page I get error Cannot read properties of null (reading 'length')

After added any text, everything works perfect.
enter image description here

What Can I do with this in intialization?

DaroGawlik
  • 37
  • 5

1 Answers1

2

In this case you should be able to use the safe navigation operator ?. to avoid the error you are receiving.

{{signupForm.controls['additionalInformation'].value?.length}} /{{maxCharsOfArea}}

https://docs.angular.lat/guide/template-expression-operators#safe-navigation-operator

If you expect that the value remains null after initialization, you could also add a nullish coalescing operator to default your value to 0

{{signupForm.controls['additionalInformation'].value?.length ?? 0}} /{{maxCharsOfArea}}
robbieAreBest
  • 1,601
  • 14
  • 16