Parsor Error: Unexpected token during angular update from 8 to 12

user_2366166 0
Viewed 581

I was doing Angular version update from 8 to 12. In which I am getting this build error.

error NG5002: Parser error: Unexpected token {, expected identifier, keyword, or string at column 2 in [{{maxLength}}]}

My component.html error line looks like below

<div>
    <span>Characters left: {{maxLength - formInputs.accountStatusReasonComment?.length}}</span>
</div>

Is this expressions have any update in Angular 12? Any idea ?

angular12 angular
1 Answers

If the formInputs.accountStatusReasonComment is undefined the expression might wind down to {{maxLength - }}. With Angular 8 it couldn't be found until runtime, but from Angular 9, Ivy AoT is default rendering engine. And it might find such useful edge case errors.

Instead of safe navigation operator you could try the following

<span>
  Characters left: {{ maxLength - (formInputs.accountStatusReasonComment.length || 0) }}
</span>

Here numeric 0 will be used if the formInputs.accountStatusReasonComment.length is undefined.

user_65139210
Related