如何在 ngFor 之外使用 *ngFor current object？

Question

标题可能看起来很奇怪，但我所说的基本上是 this link 正在做的事情。

我正在寻找一种在 *ngFor 范围之外的 <tr> 中使用当前迭代 person 的方法。

在 link 中，他使用 ng-repeat-start 和 ng-repeat-end 在 ng-repeat. 中包含多个标签我如何使用 [=13= 在 Angular2 中实现相同的行为]？

Answer 1

我不得不使用 <template> 标签，这使得在其中可以访问迭代的对象。

<ng-template let-person ngFor [ngForOf]="people">
    <tr>
        <td>{{person.name}}</td>
        <td>{{person.gender}}</td>
    </tr>
    <div>
        <span>{{person.details}}</span>
    </div>
</ng-template>

希望对大家有所帮助

Answer 2

*ngFor（以及任何 angular 指令）中的 * 是 shorthand，告诉 angular 将元素包围在 ng-template 中，这只是 angular 的实施。您可以在 https://angular.io/guide/structural-directives 了解这是如何发生的，但我将在下面重现相关示例。

如果您的代码包含

<div *ngIf='object'>{{object.property}}</div>

作为渲染过程的一部分，angular 将其转换为

<ng-template [ngIf]='object'>
   <div>{{object.property}}</div>
</ng-template>

如何在 ngFor 之外使用 *ngFor current object？

How can I use *ngFor current object outside of the ngFor?

javascript

angular

ngfor