如何在 ngFor 之外使用 *ngFor 当前对象？答案

【问题标题】：How can I use *ngFor current object outside of the ngFor?如何在 ngFor 之外使用 *ngFor 当前对象？
【发布时间】：2017-01-08 01:23:02
【问题描述】：

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

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

在链接中，他使用ng-repeat-start 和ng-repeat-end 包含多个带有ng-repeat. 的标签我如何使用*ngFor 在Angular2 中实现相同的行为？

【问题讨论】：

标签： javascript angular ngfor

【解决方案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>

希望对某人有所帮助

【讨论】：

您能否提供一个指向 Angular 文档的链接，说明为什么这样做有效？我得到的关于使用 HTML 5 模板标签的信息：angular.io/docs/ts/latest/guide/…

【解决方案2】：

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

如果您的代码包含

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

作为渲染过程的一部分，角度将其转置为

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

【讨论】：