Introducing @let in Angular

Angular introduces a new @let syntax, allowing developers to define and reuse variables within templates. This syntax addresses a long-standing issue in Angular's template syntax. @let declarations enable the definition of variables with values derived from Angular expressions. These variables can then be reused throughout the template, improving code readability and maintainability. Unlike previous solutions, @let variables are scoped to the current view and its descendants, enhancing code organization and preventing unwanted variable collisions. @let declarations are read-only and their values are recomputed during change detection, ensuring data accuracy. The formal syntax of @let includes the keyword, a variable name, the assignment operator, an Angular expression, and a semicolon terminator. Examples illustrate the use of @let to define variables for display in the template, including complex expressions using async pipes. Angular team encourages feedback on the new @let syntax to continue improving the developer experience.