Angular 2 - ng用於顯示數組中的最后3項

Question

有一個包含許多項目的數組，我想顯示最后3個項目。

得到我的HTML

          <li *ngFor="let project of projects;">
            <h2>{{ project.name }}</h2>
            <p>{{ project.meta_desciption }}</p>
          </li>

它現在顯示所有項目（超過20）。 我怎么才能只顯示最后3個？ 我想我需要在我的代碼中使用“last”，但無法弄明白https://angular.io/docs/ts/latest/api/common/index/NgFor-directive.html

Answer 1

<li *ngFor="let project of (projects | slice:projects.length - 4);">

您可能需要對projects一些額外的null檢查，或確保它始終是一個數組。

Answer 2

Gunter上面的回答在我的案例中沒有用。 我能夠完成同樣的事情，但略有不同：

<ng-container *ngFor="let project of projects; let i = index">
    <li *ngIf="i > projects.length - 4">
        <h2>{{ project.name }}</h2>
        <p>{{ project.meta_desciption }}</p>
    </li>
</ng-container>

如果循環的索引大於數組的長度減去4.所以如果長度小於3則打印全部，如果它是3或更大，它只是以它們進入的順序打印最后3個。

Answer 3

正如Gunter上面回答的那樣，您可能還需要檢查“項目”的長度是否大於4。

<div *ngIf="projects.length>4">
    <li *ngFor="let project of projects;">
        <h2>{{ project.name }}</h2>
        <p>{{ project.meta_desciption }}</p>
    </li>
</div>

Answer 4

在我的情況下獲得最后三個項目下面的代碼工作完美無需檢查項目長度它適用於任何長度的數組。

<li *ngFor="let project of (projects | slice: -3)">

---