Question

我有一个ng-repeat，在更改正在使用的数组中时不会更新。我已经研究了很长一段时间，但似乎没有任何工作。最初，当页面加载时，ng-repeat显示数据集的第一页，在获取新数据（下一页）并使用此数据设置该数组时，ng-repeat不会注意到更改，并且从不填充更新的数组。如果有人能引导我朝着正确的方向发展，我将不胜感激。

gatekeeper.controller('businessController', ['$scope', 'siteService', function($scope, siteService) {

$scope.page = 1;
$scope.resultsPerPage = 50;
$scope.maxPaginationSite = 10;
$scope.pageCount = 0;
$scope.resultCount = 0;
$scope.getBusinessSites = [];

function getBusinessSites()
{
    siteService.getBusinessSites($scope.page, $scope.resultsPerPage).then(function(response) {
        $scope.getBusinessSites = response.data;
        console.log($scope.getBusinessSites);
        $scope.resultCount = response.data[0].QueryCount;
        $scope.page = response.data[0].Page;
        $scope.pageCount = Math.ceil($scope.resultCount / 50);
    });
}
getBusinessSites();
$scope.pageChanged = function () {
    $scope.page = this.page;
    getBusinessSites($scope.page, $scope.resultsPerPage);

};

}]）;

<tbody ng-controller="businessController">

        <tr ng-repeat="site in getBusinessSites">
            <td>{{ site.SiteName }}</td>

            <td class="tableButton">

                <button ng-controller="ModalCtrl" type="button" class="btn btn-default" ng-click="open('lg')">
                    {{ site.ClientName }}
                </button>

                <br />
                <b>Facilities:</b>

                No Data Yet

            </td>

            <td>{{ site.Subdomain }}</td>

            <td>
                <a href={{ site.URL}}> {{ site.URL}} </a>

                <br />

                <b>Go-live Date: </b> No Data Yet

            </td>

            <td>No Data Yet</td>
            <td>{{site.ChannelPartner}}</td>
            <td>No Data Yet</td>
            <td>No Data Yet</td>
            <td>No Data Yet</td>
            <td>No Data Yet</td>
        </tr>
        <div >
            <uib-pagination class="pull-right" boundary-link-numbers="true" max-size="maxPaginationSite" boundary-links="true" total-items="resultCount" ng-model="page" ng-change="pageChanged()"></uib-pagination>
        </div>
    </tbody>

Answer 1

问题是ng-repeat已在此初始空数组[]上引用，当您更改$scope.getBusinessSites时，您更改此变量的引用，但ng-repeat仍在引用内存中的空数组

因此，解决方案是直接将数据写入数组的ng-repeat参考。您可以使用angular.extend功能执行此操作：

更改此行：

$scope.getBusinessSites = response.data;

关于这一个：

angular.extend($scope.getBusinessSites, response.data);

<小时/>的 UPD：此外，如果您不使用一次加载数据，则需要清除该数组中以前加载的数据：

// empties an array $scope.getBusinessSites.length = 0;

Answer 2

尝试将div包装在div中，但控制器包含在div中：

<div ng-controller="BusinessController">
    <tbody>   
        <tr ng-repeat="site in getBusinessSites">
        .
        .
        .
    </tbody>
</div>

我建议将$ scope.getBusinessSites命名为$ scope.businessSites以避免混淆：）

Answer 3

ng-repeat创建自己的范围。尝试添加$parent以引用当前控制器范围内的变量

更改阵列时，ng-repeat不会更新

3 个答案: