Question

我有以下角度模板：

<ng-container *ngFor="let item of items; let i=index">
  <ng-container *ngIf="item; else elseTemplate">
    <div (click)="g(i)">True</div>
  </ng-container>
  <ng-template #elseTemplate>
    <div (click)="f(i)">Else</div>
  </ng-template>
</ng-container>

组件的逻辑类似于：

export class TestComponent {
  items = [true, true, false, false, false];
  constructor() {}
  g(i) {
    console.log('True!', i);
  }
  f(i) {
    console.log('False!', i);
  }
}

由于某种原因，它可以正常工作。模板引用变量不应该是唯一的（在此示例中，#elseTemplate被定义了5次）？

还是ng-container创建了一个新的上下文？我特别感兴趣的是，能够将ng-for的变量（迭代器和索引）传递到else模板。

来自angular documentation on template syntax：

参考变量的范围是整个模板。不要在同一模板中多次定义相同的变量名。的运行时值将不可预测。

这是否意味着上述代码是未定义的行为，并且恰好可以正常工作？

将ng-if-else嵌套在ng-for下

0 个答案: