Angular 2 - 从数据库中获取最后 5 条记录答案

【问题标题】：Angular 2 - get last 5 records from databaseAngular 2 - 从数据库中获取最后 5 条记录
【发布时间】：2017-01-02 20:38:26
【问题描述】：

如何从数据库中获取最近 5 条记录？

logs.component.html

<table class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>Date</th>
            <th>Logging in is completed?</th>   
        </tr>
    </thead>
    <tbody> 
        <tr *ngFor="let log of logs">
            <td>{{log.date}}</td>
            <td>{{log.isCompleted}}</td>
        </tr>
    </tbody>
</table>

通过上面的代码，我得到了所有记录。我想做类似的事情：

for (int i=logs.length(); i>logs.length()-5; i--)

【问题讨论】：

您可能希望在数据库级别而不是在 JavaScript 中过滤结果，因为这样更有效。否则，您的 Angular2 应用程序将从服务器下载不必要的数据，只是忽略它

标签： angular typescript

【解决方案1】：

使用以下代码行获取最后 5 条记录。

logs.slice(Math.max(logs.length - 5, 1));

【讨论】：

【解决方案2】：

Angular 2 为 List 或 String 表达式的子集提供了 Slice Pipe。

array_or_string_expression | slice:start[:end]

例子：

<tr *ngFor="let log of logs | slice:0:4">
    <td >{{log.date}}</td>
    <td >{{log.isCompleted}}</td>
</tr>

注意：start 和 end 从零开始。

【讨论】：

【解决方案3】：

我是这样做的：

  <tr *ngFor="let log of logs; let i =index">

                    <td *ngIf ="i>=logs.length -5">{{log.date}}</td>
                    <td * ngIf="i>=logs.length -5">{{log.isCompleted}}</td>

            </tr>

【讨论】：

【解决方案4】：

关于限制 NG 的输出，请看这个答案：Angular 2: how to apply limit to *ngFor?

如果您对其余数据不做任何特殊处理，请参阅@Delosdos 评论：您应该考虑在服务器端过滤数据集。

【讨论】：