Question

所以我发现这个jsfiddle http://jsfiddle.net/EnY74/20/正在回忆某种演示数据

正如您在本示例中所看到的https://jsfiddle.net/vsfsugkg/2/，该表只有一行，我将该行修改为只包含（1,2,3）。

该表仍有1,222个条目，因此必须在javascript中调用演示数据。

如何阻止表格使用虚拟数据并在我的网站上使用此示例？我已经将它包裹在我网站的一张桌子上，但桌子正在做同样的事情重复1,222次。

'use strict';

var App = angular.module('PaginationApp', []);

App.controller('MainCtrl', ['$scope', 'TypekitService', '$filter', function($scope, Typekit, $filter){
$scope.loadData = function(){                         Typekit.getTypekits($scope.page, $scope.per_page).then(function(response){                    
        $scope.more = response.data.library.families.length === $scope.per_page;
        $scope.families = $scope.families.concat(response.data.library.families);
        $scope.status_bar = "Showing " + ($scope.families.length === 0 ? "0" : "1") + " to " + $filter('number')($scope.families.length) + " of " + $filter('number')(response.data.library.pagination.count) + " entries";

    });
};

$scope.show_more = function(){
    $scope.page += 1;
    $scope.loadData();
}

$scope.has_more = function(){
    return $scope.more;
}

$scope.per_page = 10;
$scope.page = 1;        
$scope.families = [];        
$scope.more = true;
$scope.status_bar = "";
$scope.loadData();    
}])


App.factory('TypekitService',['$http',function($http){
return {
    getTypekits : function(page, per_page){
        return $http.jsonp('https://typekit.com/api/v1/json/libraries/full?page='+page+'&per_page='+per_page+'&callback=JSON_CALLBACK');
    }
}
}]);

当我将这个分页应用到我的网站表格时，我每行重复20次，所以我最初显示200行，可以选择加载更多，有谁知道为什么？有问题的表只能保存不超过20条记录吗？

Answer 1

所以，我不确定你要做什么，但会发生什么呢。

对Typekit.getTypekits的调用获取远程数据（1,222 记录）。
检索到的数据将分配给范围变量“系列”。
在HTML模板中，您将迭代数组'系列'的所有条目。
由于您迭代的模板只包含1,2,3，因此结果是一个包含1,2,3的1,222行的表。

如果您只想显示一条记录。删除对getTypeKits的调用并自己启动系列数组。

我更新了删除所有不必要内容的示例：https://jsfiddle.net/vsfsugkg/18/

在演示模式下调用虚拟数据的AngularJS表

1 个答案: