Angular：如何结合新@if语法使用模板变量

旧的*ngIf写法（带变量赋值和可选链）：

<ng-container *ngIf="contractSignal().object1?.object2 as templateVariable">
    {{ templateVariable }}
</ng-container>

用新的@if语法可以直接这样改写，逻辑完全一致：

@if (contractSignal().object1?.object2 as templateVariable) {
    {{ templateVariable }}
}

说明 #

• @if语法支持在条件表达式后通过as直接将表达式结果赋值给模板变量，和旧*ngIf的变量绑定逻辑相同
• 同样支持可选链操作符?.，当contractSignal().object1不存在时，表达式结果为null/undefined，不会进入代码块
• @if本身是结构指令，不需要额外包裹<ng-container>，直接使用即可（如果需要组合其他结构指令，也可以和<ng-container>配合）

内容的提问来源于stack exchange，提问作者Sachin