ngFor和*ngFor有什么区别

Question

我无法在任何地方找到差异的良好描述.与*ngIf和相同ngIf

一个例子 *ngFor

<li *ngFor="let video of page" ...>
  <img src="api/Videos/{{video.id}}/thumbnail">
</li>

和一个例子 ngFor

<template ngFor let-labelid [ngForOf]="labelLookup | keyValueFilter" >
  <label  [ngStyle]="{'background-color': labelLookup[labelid].color}">
    <input (click)="changeLabel(labelid)" type="radio" name="labelSelector" value="{{ labelid }}" [checked]="labelid == 1">
  </label>
</template>

Answer 1

区别在于*ngFor转换为<template ngFor [ngForOf]="..."内部.

它们是等价的,但前者写起来更方便.

显式版本(<template ngFor ...>)允许一次将指令应用于多个元素,而隐式版本(简写)仅将元素应用于<template>标记所应用的位置.

使用Angular 2.0.0 final,<ng-container>添加了一个元素,允许在行为类似于<template>元素的元素上使用简写语法(不添加到DOM).

也可以看看

• *ngIf和*ngFor在同一元素上导致错误

• 为单个`ngFor`迭代创建两个元素？