Angular JS ng表错误TypeError:newParams重载不是一个函数，并且达到了10次摘要迭代，ABo

Angular JS ng-table errors TypeError: newParams reload is not a function and 10 digest iterations reached, ABort

本文关键字：函数 一个 迭代 ABo 10次 错误 TypeError ng JS newParams 重载      更新时间：2023-09-26

我使用的是开源的Angular JS主题SB Admin，我在这方面完成了很多工作。但我想添加Angular JS ng表，它给我带来了以下错误：

TypeError: a.reload is not a function
    at Object.fn (ng-table.min.js:3)
    at h.$digest (angular.min.js:106)
    at h.$apply (angular.min.js:109)
    at f (angular.min.js:71)
    at F (angular.min.js:75)
    at XMLHttpRequest.x.onreadystatechange (angular.min.js:76)

错误：[$rootScope:infdig]http://errors.angularjs.org/1.2.16/$rootScope/indig？p0＝10&p1=%5B%5B%22fn%3…C%22%3A%5D%7D%3B%20oldVal%3A%20%7B%5C%22数据

EDIT:：由于主题代码很大，我创建了一个只有所需内容的小Fiddle脚本，我得到了上面的内容，并且"newParams.reload不是一个函数，并且达到了10$digest（）迭代。正在中止！"错误。

请检查这个Fiddle。表似乎对我的项目很重要，任何建议都有帮助。

由于我在许多论坛上搜索了两天来寻找这个问题的解决方案，我找不到，多亏了很少有人来解决这个问题。

无论如何，我发现了实际的问题——很简单，"当你使用NgTableParams时，请不要将'NgTableParams'变量用作范围变量，始终尝试将其用作类变量"。

我不知道为什么我们必须使用类变量。但从我的角度来看（我的结论是基于错误的），由于Angular JS中的范围变量暴露给了观察者，并进入了摘要周期，这就产生了这个问题。

下面的例子非常棒：

<!DOCTYPE html>
<html>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="./dist/bootstrap.min.css">
    <link rel="stylesheet" href="./dist/bootstrap-theme.min.css">
    <!--[if lt IE 9]>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <![endif]-->
    <script src="./dist/angular.js"></script>
    <script src="./dist/ng-table.js"></script>
    <link rel="stylesheet" href="./dist/ng-table.css">
<body ng-app="main">
<div ng-controller="DemoCtrl as demo">
    <table ng-table="demo.tableParams" class="table" export-csv="csv" ng-table-columns-binding="demo.columns">
        <tr ng-repeat="user in $data">
            <td data-title="'Name'" ng-if="true">
                {{user.name}}
            </td>
            <td data-title="'Age'" ng-if="true" filter="{ age: 'text'}">
                {{user.age}}
            </td>
        </tr>
    </table>
<!--    <table ng-table="demo.tableParams" class="table" show-filter="true">
        <tr ng-repeat="user in $data">
            <td title="'Name'" filter="{ name: 'text'}" sortable="'name'">
                {{user.name}}</td>
            <td title="'Age'" filter="{ age: 'number'}" sortable="'age'">
                {{user.age}}</td>
        </tr>
    </table>
 --></div>
<script>
    var app = angular.module('main', ['ngTable']).
        controller('DemoCtrl', function($scope, NgTableParams ) {
            var self = this;
            $scope.data = [{name: "Moroni", age: 50},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34}];
        self.tableParams = new NgTableParams({
            }, {
                dataset: $scope.data
            });

    });
</script>
</body>
</html>

通过初始化$scope.tableParams = new NgTableParams({}, { dataset:[] })为我工作感谢

相关文章：