如何使用 Angular JS 显示数据库数据？

Question

如何处理将 DB 表映射到 Angular 显示，我认为这是 WebApps 中最常见的要求之一？

有几个因素需要考虑。

1)为了显示记录，二维 JSON 就可以了吗？

例如：

var myList = function($scope){
    $scope.foods = [
        {name:"Pizza" , price:100},
        {name:"Pasta" , price:50},
        {name:"Burger" , price:30},
        {name:"Pepsi" , price:10},
        {name:"Icecream" , price:15}
       ]
    };

对于刷新视图部分，发送主 IDN 的 JSON 用于刷新视图表单服务器是否是个好主意？

2) 应该在哪里处理分页。我认为完整的服务器端分页不会利用 Angular 的前端功能，如 Filter ？

短数据说

例如：

Table : Student


IDN Name  Univeristy Age 
1   Mark  USC        21
2   ...
3   ...
4   John  UFL        21

Answer 1

对象数组绝对没问题，并且在ngRepeat 中易于使用。刷新数据时，逻辑由您决定——您可以发送索引进行刷新（然后在需要时在模型中更新它们），或者只从后端请求新的响应。后者显然更容易，但实际上是否更好取决于您的应用程序和您的要求。为了减少资源使用，记得在你的ngRepeat上使用track by：

<table>
    <tr ng-repeat="user in users track by user.id">
        <!-- data -->
    </tr>
</table>

关于分页，我通常做的是在前端设置分页，并在每次请求时将limit 和offset 参数发送到后端服务器。唯一要记住的是后端必须返回请求的数据和查询表中的项目总数。我通常更喜欢在标头中发送这个数字，以便在一个请求中发送所有数据。基于 Angular.js 所拥有的知识（当前限制、偏移量和项目总数），可以轻松实现分页。

Answer 2

你可以使用ng-grid http://angular-ui.github.io/ng-grid/ 基本上，您只需从服务器发送一个 JSON 对象数组，例如您的 foods 示例

为了支持大型数据集，您可以在 ng-grid 上设置服务器端分页、过滤和排序，您可以通过将 params 对象发送回具有您需要的页面/过滤器/排序信息的服务器来完成此操作服务器 API 返回特定数据，例如

$http({ url: "/api/foods", method: "GET", params: myPageSortFilter })