angular - 解析器错误：从 8 到 12 的角度更新期间出现意外标记

Question

我正在从 8 到 12 进行 Angular 版本更新。其中我收到了这个构建错误。

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

我的 component.html 错误行如下所示

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

这个表达式在 Angular 12 中有任何更新吗？任何想法 ？

Answer 1

如果formInputs.accountStatusReasonComment未定义，则表达式可能会缩减为{{maxLength - }}。使用 Angular 8 直到运行时才能找到它，但是从 Angular 9 开始，Ivy AoT 是默认的渲染引擎。它可能会发现这样有用的边缘情况错误。

您可以尝试以下操作，而不是安全导航运算符

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

如果未定义，这里0将使用数字。formInputs.accountStatusReasonComment.length