在Angular 10中,ngIf指令无法直接引用ngFor中的变量。然而,你可以通过使用ng-container和ng-template结合ngFor来实现类似的功能。
首先,你可以使用ng-container来包裹ngFor指令,并在ng-container中定义一个模板引用变量,如下所示:
<ng-container *ngFor="let item of items; let i = index">
<ng-container *ngIf="condition">
<!-- 在这里使用item和i变量 -->
</ng-container>
</ng-container>
然后,你可以在ng-template中使用模板引用变量来引用ngFor中的变量,如下所示:
<ng-container *ngFor="let item of items; let i = index">
<ng-container *ngIf="condition">
<ng-template #myTemplate>
<!-- 在这里使用item和i变量 -->
</ng-template>
</ng-container>
</ng-container>
最后,你可以使用ngTemplateOutlet指令将ng-template插入到需要的位置,如下所示:
<ng-container *ngFor="let item of items; let i = index">
<ng-container *ngIf="condition">
<ng-container *ngTemplateOutlet="myTemplate"></ng-container>
</ng-container>
</ng-container>
通过这种方式,你可以在Angular 10中实现类似于Angular 1.5中ngIf引用ngFor变量的目标。
请注意,以上示例中的"condition"是一个代表条件的表达式,你需要根据实际情况进行替换。另外,你可以根据具体需求在ng-template中添加任何你需要的HTML代码和Angular指令。
关于腾讯云相关产品和产品介绍链接地址,由于要求不能提及具体品牌商,我无法提供相关链接。但你可以通过访问腾讯云官方网站,查找与云计算相关的产品和服务。
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云