angular2中的[ngFor]和[ngForOf]有什麼區別？

按我的理解，兩者都做同樣的功能。但是，angular2中的[ngFor]和[ngForOf]有什麼區別？

ngFor會像爲collections作品？
ngForOf會像爲generics作品？

我的理解是正確的？或能否請您對ngFor和ngForOf分享更差的（詳細信息）？

來源

2017-04-13 Ramesh Rajendran

問得好！我也想問！順便說一句，你的鏈接對於收藏和仿製藥都是一樣的 – Sajeetharan

@Sajeetharan Typo問題。對不起。現在我已經更新了我的問題。謝謝 –

https：// github。com/angular/angular/commit/86b2b2504f336e9ae69dfbc46c6731468781b944 – yurzui

ngFor和ngForOf不是兩個不同的東西 - 它們實際上是NgForOf指令的選擇。

如果您檢查source，您會看到NgForOf指令的選擇器爲：[ngFor][ngForOf]，這意味着這兩個屬性都需要存在於指令「激活」的元素上。

當您使用*ngFor時，Angular編譯器會將該語法轉換爲其元素上具有兩個屬性的cannonical形式。

所以，

<div *ngFor="let item of items"></div>

desugars到：

<template [ngFor]="let item of items"> 
    <div></div> 
</template>

這第一脫糖是由於 '*'。下一個脫糖是因爲微語法：「let item of items」。

<template ngFor let-item="$implicit" [ngForOf]="items"> 
    <div>...</div> 
</template>

（在這裏你能想到的$隱含作爲該指令用來指代當前項在迭代內部變量）：記述的角度編譯器去糖。

在其規範形式中，ngFor屬性只是一個標記，而ngForOf屬性實際上是指令的輸入，指向您要迭代的事物列表。

你可以查看Angular microsyntax guide瞭解更多。

來源

2017-04-13 10:03:09 snorkpete

不是'ngFor'實際指令，而'ngForOf'只是「脫糖」版本的屬性？ – devnull69

好吧，在技術上，ngForOf是實現該指令的類的名稱（再次參見源代碼）。只是沒有人真正用這個名字來引用它 - ngFor基本上就是它在所有文檔和對話中的引用。 – snorkpete

你的例子都是相當錯誤的。我不認爲有2個步驟，最終結果將是'' –

ngFor棱角分明的結構指令，它取代了ng-repeat屬性的AngularJS

您可以使用ngFor作爲簡寫

<li *ngFor="let item of items">{{item.name}}</li>

或作爲速記版本

<template ngFor let-item="$implicit" [ngForOf]="items"> 
    {{item.name}} 
</template>

來源

2017-04-13 10:06:13 devnull69

「速記」和「朗手」是否意味着數據大小？或者是什麼？ –

這意味着：用於相同目的和效果的差異 – devnull69

好吧，現在我明白了。但是每當我在文檔'ngForOf：NgIterable 中看到這行：可迭代表達式的值。當表達式更加複雜時，這很有用，例如在使用異步管道（userStreams | async）時，屬性訪問是真的不可理解的。 –

在我意見我從角文件得到，

[ngFor]不是type safe
[NgForOf]是type safe

因爲兩個類細節一點不同

ngFor類型是類型any
但ngForOf類的細節是 ngForOf : NgIterable<T>

ngForOf看起來像我已經在我的問題已經提到的仿製藥。

來源

2017-04-13 10:24:58

有趣。但是，由於它們是從模板中使用的，所以在實踐中這比在其他情況下更不重要。也就是說，Angular API的數量，包括不適合模板使用的類型，比如'FormBuilder'，這些類型都沒有被檢查過，令人不安。 –

顯式版本

(<template ngFor ...>)允許一次應用該指令將多個元素

隱版本

只包裹在那裏它被施加在元件

來源

2017-04-26 00:21:29

NgFor可以迭代數組，但在ngContainer中，ngContent不能直接迭代ngFor對於迭代，我們可以使用 [ngForOf]。這裏我是可變的，收視率是一個數組。

Ex。

<ng-template ngFor let-i [ngForOf]="ratings"> 
        <option *ngIf="i<=22" [ngValue]="i">{{i}}:00 Hrs.</option> 
    </ng-template>

在這個例子中，我想同時應用ngFor和ngIf，所以我用它。

另一種觀點是，在一個正常的，如果我們申請ngFor然後在使其轉換成

<template ngFor let-i [ngForOf]="ratings"> 
    <HTML Element>...</HTML Element> 
</template>

來源

2018-02-15 07:30:00

angular2中的[ngFor]和[ngForOf]有什麼區別？

回答

相關問題